Display Appealing Logs In Web Console – PrettyLog

Category: Javascript | September 11, 2020
Views Total:312 views
Official Page:Go to website
Last Update:September 11, 2020


Display Appealing Logs In Web Console – PrettyLog


PrettyLog is a JavaScript library to replace the console.log() function that applies custom styles to log badges (labels) and messages displayed in the web console.

How to use it:

1. Install the PrettyLog with NPM.

$ npm i pretty-browser-log --save

2. Import the PrettyLog.

import {prettyLog} from './src/prettylog.js';
export {prettyLog};
import {prettyLog as log} from './index.js'

3. Create your own themes by applying custom CSS styles to logs.

  {name:'noLabel',badge:'',badgeStyle:'border: 0',messageStyle:'color:#4CD964; border: 1px solid;border-radius:0.4rem;padding:2px 6px'},
  {name:'dot',badge:'  ',badgeStyle:'background-color:orange ;border-radius:50%',messageStyle:''},
  // ...

4. Display logs with different styles in the browser console.

// default
log.msg('Log Messages Here');
// title theme
log.title('Log Messages Here');
// danger theme
log.danger('Log Messages Here');
// success theme
log.success('Log Messages Here');
// action theme
log.action('Log Messages Here');
// todo theme
log.todo('Log Messages Here');
// with no label
log.noLabel('Log Messages Here');
// dot themes
log.dot('Log Messages Here');

You Might Be Interested In:

Leave a Reply