diff --git a/web/pgadmin/static/scss/_pgadmin.style.scss b/web/pgadmin/static/scss/_pgadmin.style.scss
index 2bd4d5a19..52f96170b 100644
--- a/web/pgadmin/static/scss/_pgadmin.style.scss
+++ b/web/pgadmin/static/scss/_pgadmin.style.scss
@@ -287,6 +287,7 @@
     margin-top: 25px !important;
     position: relative;
     text-align: center;
+    font-size: $font-size-base;
 
     &:before {
         font-family: $font-family-icon;
diff --git a/web/pgadmin/tools/sqleditor/static/js/sqleditor.js b/web/pgadmin/tools/sqleditor/static/js/sqleditor.js
index ddd9ad701..b4ee29e50 100644
--- a/web/pgadmin/tools/sqleditor/static/js/sqleditor.js
+++ b/web/pgadmin/tools/sqleditor/static/js/sqleditor.js
@@ -76,6 +76,14 @@ define('tools.querytool', [
 
   var is_query_running = false;
 
+  const EMPTY_DATA_OUTPUT_CONTENT = '<div role="status" class="pg-panel-message">' +
+    gettext('No data output. Execute a query to get output.') +
+  '</div>';
+
+  const EMPTY_EXPLAIN_CONTENT = '<div role="status" class="pg-panel-message">' +
+    gettext('Use Explain/Explain analyze button to generate the plan for a query. Alternatively, you can also execute "EXPLAIN (FORMAT JSON) [QUERY]".') +
+  '</div>';
+
   // Defining Backbone view for the sql grid.
   var SQLEditorView = Backbone.View.extend({
     initialize: function(opts) {
@@ -251,7 +259,7 @@ define('tools.querytool', [
         isCloseable: false,
         isPrivate: true,
         extraClasses: 'hide-vertical-scrollbar',
-        content: '<div id ="datagrid" class="sql-editor-grid-container text-12" tabindex="0"></div>',
+        content: `<div id ="datagrid" class="sql-editor-grid-container text-12" tabindex="0">${EMPTY_DATA_OUTPUT_CONTENT}</div>`,
       });
 
       var explain = new pgAdmin.Browser.Panel({
@@ -261,7 +269,7 @@ define('tools.querytool', [
         height: '100%',
         isCloseable: false,
         isPrivate: true,
-        content: '<div class="sql-editor-explain" tabindex="0"></div>',
+        content: `<div class="sql-editor-explain pg-el-container" tabindex="0">${EMPTY_EXPLAIN_CONTENT}</div>`,
       });
 
       var messages = new pgAdmin.Browser.Panel({
@@ -2658,7 +2666,7 @@ define('tools.querytool', [
         self.changedModels = [];
         self.has_oids = data.has_oids;
         self.oids = data.oids;
-        $('.sql-editor-explain').empty();
+        $('.sql-editor-explain').html(EMPTY_EXPLAIN_CONTENT);
         self.explain_plan = false;
 
         /* If object don't have primary keys then set the