diff --git a/src/backend/src/modules/selfhosted/DefaultUserService.js b/src/backend/src/modules/selfhosted/DefaultUserService.js
index 24eb675c..32fc05e9 100644
--- a/src/backend/src/modules/selfhosted/DefaultUserService.js
+++ b/src/backend/src/modules/selfhosted/DefaultUserService.js
@@ -27,6 +27,7 @@ const { buffer_to_stream } = require("../../util/streamutil");
 const BaseService = require("../../services/BaseService");
 const { Actor, UserActorType } = require("../../services/auth/Actor");
 const { DB_WRITE } = require("../../services/database/consts");
+const { TEAL } = require("../../services/NullDevConsoleService");
 const { quot } = require('@heyputer/putility').libs.string;
 
 const USERNAME = 'admin';
@@ -92,14 +93,27 @@ class DefaultUserService extends BaseService {
         // console.log(`password for admin is: ${tmp_password}`);
         const svc_devConsole = this.services.get('dev-console');
 
+        // console.log('\n');
+        // console.log("************************************************");
+        // console.log('* Your default login credentials are:');
+        // console.log(`* Username: \x1b[1m${USERNAME}\x1b[0m`);
+        // console.log(`* Password: \x1b[1m${tmp_password}\x1b[0m`);
+        // console.log("************************************************");
+        // console.log('\n');
+
         console.log('\n');
-        console.log("************************************************");
-        console.log('* Your default login credentials are:');
-        console.log(`* Username: \x1b[1m${USERNAME}\x1b[0m`);
-        console.log(`* Password: \x1b[1m${tmp_password}\x1b[0m`);
-        console.log("************************************************");
+        svc_devConsole.notice({
+            colors: TEAL,
+            style: 'stars',
+            title: 'Your default login credentials are',
+            lines: [
+                'Username: \x1b[1madmin\x1b[0m',
+                `Password: \x1b[1m${tmp_password}\x1b[0m`,
+            ],
+        });
         console.log('\n');
 
+
         // show console widget
         this.default_user_widget = ({ is_docker }) => {
             if ( is_docker ) {
diff --git a/src/backend/src/services/DevConsoleService.js b/src/backend/src/services/DevConsoleService.js
index cd9898dc..e990bb06 100644
--- a/src/backend/src/services/DevConsoleService.js
+++ b/src/backend/src/services/DevConsoleService.js
@@ -17,8 +17,10 @@
  * You should have received a copy of the GNU Affero General Public License
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
  */
+const { ansi_visible_length } = require('@heyputer/putility/src/libs/string');
 const { consoleLogManager } = require('../util/consolelog');
 const BaseService = require('./BaseService');
+const { NullDevConsoleService } = require('./NullDevConsoleService');
 
 
 /**
@@ -91,18 +93,8 @@ class DevConsoleService extends BaseService {
         this.mark_updated();
     }
     
-    notice ({ colors, title, lines }) {
-        colors = colors ?? {
-            bg: '46',
-            bginv: '36',
-        };
-
-        console.log(`\x1B[${colors.bginv}m▐\x1B[0m\x1B[${colors.bg}m ${title} \x1B[0m`);
-        for ( const line of lines ) {
-            console.log(`\x1B[${colors.bginv}m▐▌\x1B[0m${line}\x1B[0m`);
-        }
-    }
-
+    notice = NullDevConsoleService.notice;
+    
     /**
      * Updates the displayed output based on the current state of widgets.
      * This method collects output from all active widgets, handles any errors, 
diff --git a/src/backend/src/services/NullDevConsoleService.js b/src/backend/src/services/NullDevConsoleService.js
index fca4ae85..f069ece7 100644
--- a/src/backend/src/services/NullDevConsoleService.js
+++ b/src/backend/src/services/NullDevConsoleService.js
@@ -1,5 +1,11 @@
+const { ansi_visible_length } = require("@heyputer/putility/src/libs/string");
 const BaseService = require("./BaseService");
 
+const TEAL = {
+    bg: '38;2;0;0;0;48;2;0;252;202;1',
+    bginv: '38;2;0;252;202;1',
+};
+
 /**
  * When DevConsoleService is not enabled, it is a more robust approach
  * to replace it with a null implementation rather than not have
@@ -8,16 +14,44 @@ const BaseService = require("./BaseService");
  * it exists are likely only to be caught in the production environment.
  */
 class NullDevConsoleService extends BaseService {
-    notice ({ colors, title, lines }) {
+    notice ({ colors, title, lines, style }) {
         colors = colors ?? {
             bg: '46',
             bginv: '36',
         };
-
-        console.log(`\x1B[${colors.bginv}m▐\x1B[0m\x1B[${colors.bg}m ${title} \x1B[0m`);
+        
+        // line length
+        let longest_lines_length = 0;
         for ( const line of lines ) {
-            console.log(`\x1B[${colors.bginv}m▐▌\x1B[0m${line}\x1B[0m`);
+            const this_lines_length = ansi_visible_length(line);
+            if ( this_lines_length > longest_lines_length ) {
+                longest_lines_length = this_lines_length;
+            }
         }
+        
+        if ( title.length > longest_lines_length ) {
+            longest_lines_length = title.length;
+        }
+        
+        ({
+            highlighter: () => {
+                console.log(`\x1B[${colors.bginv}m▐\x1B[0m\x1B[${colors.bg}m ${title} \x1B[0m`);
+                for ( const line of lines ) {
+                    console.log(`\x1B[${colors.bginv}m▐▌\x1B[0m${line}\x1B[0m`);
+                }
+            },
+            stars: () => {
+                const len = longest_lines_length + 1;
+                const horiz = Array(len).fill('*').join('');
+                console.log(`\x1B[${colors.bginv}m**${horiz}**\x1B[0m`);
+                console.log(`\x1B[${colors.bginv}m*\x1B[0m ${(title + ':').padEnd(len)} \x1B[${colors.bginv}m*\x1B[0m`);
+                for ( const line of lines ) {
+                    const diff = line.length - ansi_visible_length(line);
+                    console.log(`\x1B[${colors.bginv}m*\x1B[0m ${line.padEnd(len + diff)} \x1B[${colors.bginv}m*\x1B[0m`);
+                }
+                console.log(`\x1B[${colors.bginv}m**${horiz}**\x1B[0m`);
+            },
+        })[style ?? 'highlighter']();
     }
     turn_on_the_warning_lights () {}
     add_widget () {}
@@ -25,5 +59,6 @@ class NullDevConsoleService extends BaseService {
 }
 
 module.exports = {
-    NullDevConsoleService
+    NullDevConsoleService,
+    TEAL,
 };
diff --git a/src/putility/src/libs/string.js b/src/putility/src/libs/string.js
index 9f8d2a6f..1d60e9a0 100644
--- a/src/putility/src/libs/string.js
+++ b/src/putility/src/libs/string.js
@@ -99,9 +99,16 @@ const wrap_text = (text, width = 71) => {
     return out;
 };
 
+const ansi_visible_length = str => {
+    // Regex that matches ANSI escape sequences
+    const ansiRegex = /\x1b\[[0-9;]*m/g;
+    return str.replace(ansiRegex, '').length;
+};
+
 module.exports = {
     quot,
     osclink,
     format_as_usd,
     wrap_text,
+    ansi_visible_length,
 };