Las herramientas de diseño reúnen las pequeñas comprobaciones que necesitas al trabajar con el color y los detalles visuales. Por ahora, la herramienta de esta categoría es el selector de color: eliges un color de forma visual y ves sus valores HEX y RGB uno al lado del otro. Funciona en tu navegador, así que los colores que eliges no se envían a ningún sitio.
Un valor HEX como #5D1DB0 es la notación que más verás en CSS, en programas de diseño y en manuales de marca. El valor RGB describe el mismo color mediante sus canales rojo, verde y azul, cada uno de 0 a 255, y es el punto de partida para escribir rgba() cuando necesitas transparencia. Los dos expresan exactamente el mismo color; solo cambia la forma de escribirlo.
- ¿Llevas el color de una marca a tu web? Copia el valor HEX directamente en tu CSS.
- ¿Tienes el logotipo solo en SVG y una plataforma pide PNG? Conviértelo con SVG a PNG.
- Al combinar colores de texto y fondo, comprueba la legibilidad: un texto blanco sobre gris claro desaparece en muchas pantallas.
La guía de códigos de color HEX y RGB explica la notación a fondo.