Tonos de Azul: 12 Tipos y HEX
Estos son los 12 tonos de azul más usados, del más claro al más oscuro.
Explora todos los tonos de azul, desde los más claros hasta los más oscuros. Consulta los códigos HEX, los nombres de los tonos y las paletas de colores azul. Haz clic en cualquier tono para copiar su código HEX.
El azul es el color más usado en software y el que más confianza genera en marcas, en parte porque casi a nadie le desagrada. Se aleja del ojo, así que es un fondo seguro.
Su riesgo es la frialdad: agrega un acento cálido o elige un azul con algo de verde para que se sienta más cercano.
- titan white#ebebff
- periwinkle#d2d2ff
- melrose#babaff
- malibu#8989ff
- cornflower blue#7070ff
- dodger blue#5858ff
- blue ribbon#4040ff
- blue#2727ff
- dark blue#0000dd
- navy blue#000094
- stratos#00004a
- black russian#00001a
Azul: Códigos HEX y RGB
azul tiene los siguientes códigos de color principales:
HEX: #ebebff
RGB: (235, 235, 255).
Explora una amplia gama de tonos de azul con nuestro selector de colores interactivo. ¡Haz clic en cualquier color para copiar su código HEX y usarlo en tu proyecto!
Explora los tonos más claros de azul
Titan White
#ebebff
Titan White
#ebebff
Titan White
#f0f0ff
Titan White
#f0f0ff
Titan White
#f5f5ff
Titan White
#f5f5ff
Titan White
#f5f5ff
Titan White
#fafaff
Titan White
#fafaff
White
#ffffff
Explora los tonos más oscuros de azul
Violet
#090934
Bunting
#15154c
Cloud Burst
#252565
East Bay
#3b3b81
Butterfly Bush
#55559b
Wild Blue Yonder
#7474b4
Blue Bell
#9494cc
Periwinkle Gray
#bdbde5
azul en HEX, RGB, HSL y CMYK
| HEX | #0000FF | |
|---|---|---|
| RGB | rgb(0, 0, 255) | |
| HSL | hsl(240, 100%, 50%) | |
| CMYK | cmyk(100%, 100%, 0%, 0%) |
Tonos claros y oscuros de azul
Los tonos claros suman blanco y los oscuros suman negro, sin cambiar el matiz. Sirven para estados hover, bordes y fondos que deben seguir siendo del mismo color.
Más claros
#2727ff
#4e4eff
#7575ff
#9c9cff
#c4c4ff
#ebebff
Más oscuros
#0000d8
#0000b1
#00008a
#000063
#00003b
#000014
Colores que combinan con azul
Complementario
#0000FF #ffff00
El opuesto en el círculo cromático. Contraste máximo: úsalo como acento, no en media página.
Análogos
#007fff #0000FF #7f00ff
Vecinos en el círculo. Tranquilos y coherentes, la forma más segura de armar una paleta.
Tríada
#0000FF #ff0000 #00ff00
Tres colores a la misma distancia. Vivos y equilibrados; deja que uno mande.
Texto sobre azul
Medido según las WCAG: 4.5:1 para texto normal y 3:1 para texto grande. Prueba tu propia combinación en el Verificador de contraste
Carta de tonos de azul

Haz clic derecho para guardar la carta, o copia los códigos de arriba.