BotBeta
Admin
Sigma
Verificado
Verificación en dos pasos activada
Verificado por Whatsapp
¡Usuario popular!
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Suscripción a IA
Cuando deseas agregar colores al texto impreso en la consola de JavaScript, puedes usar diferentes enfoques. A continuación, te muestro varias formas de hacerlo:Cuentame todo sobre como poner colores en un print/texto de varias formas con constante, {} , +, etc
### 1. Usando
%c en console.log()Puedes aplicar estilos CSS a tu texto en la consola usando el formato
%c en combinación con console.log(). Aquí tienes un ejemplo:
JavaScript:
console.log('%cTexto en rojo', 'color: red; font-size: 16px;');
console.log('%cTexto en azul', 'color: blue; font-weight: bold;');
### 2. Usando Plantillas Literales
Puedes usar plantillas literales para evitar la concatenación manual y hacer el código más limpio:
JavaScript:
const colorRojo = 'color: red;';
const colorVerde = 'color: green;';
console.log(`%cTexto en rojo`, colorRojo);
console.log(`%cTexto en verde`, colorVerde);
### 3. Concatenación de Strings
Puedes concatenar estilos y textos de varias maneras:
JavaScript:
const estilo = 'color: purple; font-size: 20px;';
const mensaje = 'Texto en púrpura';
console.log('%c' + mensaje, estilo);
### 4. Usando Objetos con
{}Si deseas usar un objeto para almacenar estilos, puedes hacerlo y luego aplicarlos:
JavaScript:
const estilos = {
rojo: 'color: red;',
azul: 'color: blue; font-size: 16px;'
};
console.log(`%cTexto en rojo`, estilos.rojo);
console.log(`%cTexto en azul`, estilos.azul);
### 5. Estilos Múltiples
Puedes aplicar múltiples estilos en un solo
console.log():
JavaScript:
console.log('%cTexto con múltiples estilos', 'color: orange; font-weight: bold; font-style: italic;');
### 6. Ejemplo Completo
Aquí hay un ejemplo que combina varios métodos:
JavaScript:
const estilos = {
error: 'color: red; font-weight: bold;',
aviso: 'color: yellow;',
éxito: 'color: green; font-weight: bold;'
};
console.log(`%cEste es un error`, estilos.error);
console.log(`%cEste es un aviso`, estilos.aviso);
console.log(`%cEste es un mensaje de éxito`, estilos.éxito);
### Nota
Ten en cuenta que los estilos en la consola no pueden ser visibles en algunos navegadores o entornos de ejecución, y los estilos específicamente aplicados pueden no ser soportados en todos los navegadores (especialmente en sus versiones más antiguas).
Espero que esta información te ayude a jugar con los colores en la consola. Si necesitas más ayuda o ejemplos, ¡avísame!