log-css.js

locs-css.ts

const log = console.log.bind(console.log)

const logCss = (text: string, options: { [key: string]: string | number }): string[] => {
    let cssOptions = ""

    for (const prop in options) {
        const value = options[prop],
            _prop = camelCaseToDashCase(prop)
        cssOptions += `${_prop}: ${value}; `
    }
    return [`%c${text}`, cssOptions.trim()]

    function camelCaseToDashCase(value: string): string {
        return value.replace(/[A-Z]/g, matched => `-${matched.toLowerCase()}`)
    }
}

log-css.js

// log-css.js v2
const log = console.log.bind()
const css = (text, options) => {
	let cssOptions = ''
	for (let prop in options) {
		const value = options[prop]
		prop = camelCaseToDashCase(prop)
		cssOptions += `${prop}: ${value}; `
	}
	return [`%c${text}`, cssOptions.trim()]

	function camelCaseToDashCase(value) {
		return value.replace(/[A-Z]/g, matched => `-${matched.toLowerCase()}`)
	}
}

log-css.js v1

// log-css.js v1.1
const log = console.log.bind();
const css = function(item, color = '#fff', background = 'none', fontSize = '12px', fontWeight = 700, fontFamily) {
	return ['%c' + item, 'color:' + color + ';background:' + background + ';font-size:' + fontSize + ';font-weight:' + fontWeight + (fontFamily ? ';font-family:' + fontFamily : '')];
};

// example
log(...css('TEXT', 'rebeccapurple', '#000', '14px'));

Example v2:

log(...css('Example =P', {
	backgroundColor: 'blue',
	color: 'white',
	fontFamily: 'Consolas',
	fontSize: '25px',
	fontWeight: '700',
	lineHeight: '20px',
	padding: '7px 7px'
}))

Example v2:
log(...css('asduhasudha', {'font-size': '20px', backgroundColor: 'rebeccapurple', color: '#fff', 'padding': '0.2rem'}))