Tiza

Tiza is a JavaScript library for browsers' console styling.

View demo here: https://tiza.js.org

Installation

NPM

npm install --save tiza

Then import it:

import tiza from 'tiza'
// or via require if you are using commonjs
const tiza = require('tiza').default

UMD bundle

Add script tag to your HTML file:

<script src="https://unpkg.com/tiza/dist/tiza.min.js"></script>

Usage

import tiza from 'tiza'
 
tiza
  .color('#fff') // Set color, all CSS colors are supported
  .bgColor('purple') // Set background color
  .bold() // Set bold font
  .italic() // Set italic font
  .size(20) // Set font size
 
  // Support custom styles too!
  .style(`padding: 4px; border-radius: 2px;`)
 
  // After styles done right, it's time to add text now
  .text('Hey, I have styling now!')
 
  .space(8) // Add spaces
  .text('Hey, I am far away from previous one')
 
  .newline(2) // Add newline
 
  .reset() // Reset all styles set before
 
  .text('I lost my styles, because `reset` is called')
 
  .log() // log all texts above to console

Always remember to call log method at last.

Styles reusing

To reuse styles, just make them nested like this:

const error = tiza.color('red').text
const info = tiza.bold().bgColor('yellow').text
 
tiza.log(
  error('I am some error'),
  'I am some normal message',
  error('I am some error again!'),
  info('I am some info', error('I am still some error!')),
)

Notice that inside texts will not extend outside texts' styles.

For more detail see API

How does it work?

https://developers.google.com/web/tools/chrome-devtools/console/console-write

Find Styling console output with CSS

Who's using Tiza

Console Importer

API

Method	Description
tiza.color('#f00')	Set font color, support all CSS colors
tiza.bgColor('#f00')	Set background color, support all CSS colors
tiza.bold()	Set font weight to bold
tiza.italic()	Set font style to italic
tiza.size(14)	Set font size, number will be converted to px
tiza.style('color:#f00')	Set custom style, using inline style format
tiza.reset()	Reset styles set before
tiza.text(...args: string[])	Add text(s), support multiple arguments. Every text added here will be styled with styles set previously. Notice that every argument will be converted to string, and there will be no space between them(This behaviour is different with console.log). If you want to add a space, use text('a').space().text('b')
tiza.space(count?: number)	Add space. The default count is 1
tiza.newline(count?: number)	Add newline. The default count is 1
tiza.log()	Log all texts to console with console.log. Always remember to call log at last. Arguments are also supported, log(...args) equals to text(...args).log()
tiza.info()	The same as tiza.log, but output with console.info
tiza.warn()	The same as tiza.log, but output with console.warn
tiza.error()	The same as tiza.log, but output with console.error

License

MIT