Saltar hasta el contenido principal

Azul

Todo lo que necesitas saber sobre el azul para inspirar tu próximo diseño.

Obtener paleta de colores

Elegir un color

Hex

RGB

HSB

HSL

Selecciona la paleta

Paletas de colores personalizadas

El azul es uno de los tres colores primarios dentro del modelo de color RGB y se puede crear combinando cian y magenta dentro del modelo de color CMYK. El azul se asocia con sentimientos de calma y tranquilidad, reflejando la apariencia del cielo y grandes cuerpos de agua. Los diseñadores pueden utilizar los muchos matices y tonos fríos del azul para evocar una amplia variedad de emociones, desde la serenidad hasta la melancolía.

color Azulcolor Azul

El azul se define por los siguientes códigos y valores de color para garantizar la consistencia en varias plataformas y dispositivos digitales.

  • Código HEX: #0000FF
  • Valor RGB: 0% rojo, 0% verde y 100% azul

Las consideraciones de accesibilidad juegan un papel crucial en las elecciones de color de diseño UX y UI. Figma ofrece complementos en la Comunidad para asegurarse de que tus diseños cumplan con las Pautas de Accesibilidad de Contenido Web.

Aquí hay algunas formas de usar el azul en tus diseños:

  • Transmitir una sensación de confianza. El color azul se asocia comúnmente con la estabilidad, la confianza y el profesionalismo. Úsalo en diseños para corporaciones, bancos y otras empresas que desees presentar como confiables o tranquilizadoras.
  • Promover una sensación de calma. Usa el azul estratégicamente en tus diseños para relajar a los usuarios. Herramientas como Zoom y Smartsheet utilizan tonos de azul para promover el enfoque y la productividad en entornos de trabajo.
  • Establecer una jerarquía visual. Usa diferentes tonos de azul para crear una sensación de jerarquía visual. Usa tonos de azul más claros para llamar la atención sobre elementos más prominentes, como botones y encabezados.

Ten en cuenta que el color y su significado pueden cambiar de una cultura a otra, y en cualquier momento. Si estás diseñando para una audiencia global, investiga las consideraciones de color para tus regiones específicas.

Para variaciones dentro del mismo espectro relajante y profesional que el azul, considera:

  • Azul pizarra (#5B7C99) es una alternativa discreta para aplicaciones profesionales con su tono gris-azulado apagado.
  • Azul polvo (#B6D0E2) es una opción para diseñadores que buscan profundizar en el aspecto calmante del azul, proporcionando un tono más delicado.
  • Cerúleo (#2A52BE) es un tono de azul ligeramente más vibrante, como el cielo en un día soleado, pero lo suficientemente reservado para casos de uso empresarial.
  • Turquesa (#40E0D0) se inclina más hacia el mundo del verde pero mantiene las sensaciones relajadas y sutiles del azul estándar.

Utilizar tonos neutros, como el blanco o el gris, es una elección inteligente cuando deseas que el impacto completo del color azul destaque en tus diseños. Para hacer que tu diseño resalte un poco, implementa colores complementarios como el naranja. También podrías considerar:

  • Beige (#EDE8D0) proporciona un tono cálido que contrasta agradablemente pero permite que el azul siga siendo el foco principal de atención.
  • Azul marino (#000080) es un tono más oscuro que complementa el azul estándar, añadiendo profundidad adicional a tu paleta de colores azul.
  • Durazno (#FFD3AC) combina bien con el azul para lograr una cálida sensación de confort y calma.
  • Amarillo (#FFFF00) inyectará vida a tus diseños azules, sirviendo como un color alegre que contrasta y añade vitalidad.
  • Plata (#C4C4C4) es un color metálico con tonos fríos que funciona bien como un acento en diseños azules, ayudando a lograr un aire de elegancia.

Otros colores que vale la pena considerar incluyen lavanda, que añade profundidad y sofisticación a tu paleta de colores azul. Otra opción es mostaza, que añade un toque de color que no es tan vibrante y ruidoso como el amarillo clásico.

Aunque el azul es altamente adaptable, puede chocar con:

  • Rojo (#FF2C2C) puede ser abrumador cuando se combina con azul si los dos colores no están cuidadosamente equilibrados.
  • Marrón (#895129) parece que podría funcionar bien, pero sus tonos cálidos no siempre complementan la frescura del azul.
  • Verde lima (#89F336) y otros colores altamente saturados pueden chocar con el azul, especialmente en diseños grandes.
  • Verde menta (#ADEBB3) es otro tono de verde que no se mezcla bien con el azul; puede parecer demasiado dominante en muchos contextos.
  • Oro (#EFBF04) puede chocar con el azul si no se usa con moderación como un acento.

Dentro de la teoría del color, el azul simboliza la armonía y la tranquilidad. Las personas recurren al azul para establecer una sensación de seguridad y fiabilidad en entornos profesionales. Sin embargo, el significado del azul varía entre culturas. Los antiguos griegos lo veían como un color que simbolizaba a los dioses y los cielos. Los pueblos indígenas en los Estados Unidos continúan viéndolo como un símbolo de sabiduría, espiritualidad y sanación.

El azul, asociado con el cielo y el océano, evoca sentimientos de calma y relajación. Estas emociones ayudan a conectar el azul con sentimientos adicionales de confianza y seguridad. Los diseñadores comúnmente usan el azul para ayudar a aliviar el estrés, como en hospitales y oficinas.

Los diseñadores también integran el azul cuando quieren relajar a los espectadores. Además, porque puede impartir una sensación de confianza y estabilidad al espectador, el azul es una excelente opción al crear una marca e identidad corporativa.

El color azul deriva su nombre de la palabra francesa antigua “bleu”, que proviene del idioma protoindoeuropeo. La raíz “bhel” originalmente significaba “brillar”. Durante tiempos prehistóricos, las civilizaciones antiguas crearon el pigmento usando minerales como lapislázuli y azurita.

Los antiguos egipcios usaban mucho el color azul, viéndolo como un símbolo de lo divino. La civilización egipcia antigua usó tanto el azul que inventaron un tono que seguimos refiriendo como azul egipcio; los egipcios sintetizaron el color a partir de sílice, cal, cobre y álcali. Lo utilizaron en arte, joyería, cosméticos y para pintar el exterior de las pirámides. Los antiguos griegos también valoraban el color azul, integrándolo en el arte y la arquitectura.

Durante la Edad Media y el Renacimiento, el azul se asoció con la realeza. El pigmento era raro y costoso, haciéndolo más valioso que algunos metales preciosos, incluido el oro. Para la Revolución Industrial, los químicos descubrieron cómo hacer pigmentos azules sintéticos, haciendo el color más asequible.

Variantes de color

Sombras

Tintes

Tonos

Tonalidades

Armonías de color

Complementaria

Complementaria dividida

Monocromática

Análoga

Triádica

Square

Paletas personalizadas

Eco Azur

Noche estrellada

Tejedor de sueños

Comprobador de contraste

Contraste 8,59

Texto largo

#0000FF

Texto normal

Cómo diseñas, alineas, y desarrollas importa. Hazlo con Figma.

Se trata de un texto #0000FF sobre un fondo #FFFFFF.
Categoría
Aprobar
Aprobar
Aprobar
Aprobar
Aprobar
Aprobar

Contraste 2,44

Texto largo

#0000FF

Texto normal

Cómo diseñas, alineas, y desarrollas importa. Hazlo con Figma.

Se trata de un texto #0000FF sobre un fondo #000000.
Categoría
Desaprobar
Desaprobar
Desaprobar
Desaprobar
Desaprobar
Desaprobar

Simulaciones de color

Protanopia

Deuteranopia

Tritanopia

Acromatopsia

El color hexadecimal #0000ff, también llamado Azul, tiene valores RGB de R:0, G:0, B:255 y valores CMYK de C:100, M:100, Y:0, K:0.

VALUECSS
HEX#0000ff#0000ff
RGB DECIMAL0, 0, 255RGB(0,0,255)
RGB PERCENTAGE0.0, 0.0, 100.0RGB(0.0%,0.0%,100.0%)
CMYK100, 100, 0, 0
HSLHSL(240.0, 100.0%, 50.0%)HSL(240.0, 100.0%, 50.0%)
HSV (OR HSB)240.0°, 100.0, 100.0
WEB SAFE#00255#00255
BINARY00000000, 00000000, 11111111
iOS - SwiftUIColor(red: 0.000, green: 0.000, blue: 1.000)
iOS - UIKitUIColor(red: 0.000, green: 0.000, blue: 1.000, alpha: 1)
Android - ComposeColor(0xFF0000FF)