Saltar al contenido principal

Azul marino

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

Crear paleta de colores

Elige un color

Hex

RGB

HSB

HSL

Selecciona la paleta

Paletas personalizadas

El azul marino es un color sofisticado y sereno con sutiles matices púrpuras que realzan su sentido de lujo y elegancia. Este tono profundo y rico se encuentra en la sección azul-violeta de la rueda de colores, denotando un tono más frío. Incluye matices como azul medianoche y azul tinta.

color azul marinocolor azul marino

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

- Código HEX: #000080

- Valor RGB: 0% rojo, 0% verde y 50.2% azul

La accesibilidad juega un papel clave en la elección de colores en el diseño UX y UI. La comunidad de Figma ofrece plugins para ayudarte a cumplir con las Web Content Accessibility Guidelines.

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

  • Transmitir autoridad y confianza. Usa el azul marino para elementos que requieran que los usuarios sientan una sensación de fiabilidad y seguridad, como pantallas de inicio de sesión, interfaces de transacciones financieras o aplicaciones de salud y bienestar. La asociación del color con la autoridad y la confiabilidad lo hace ideal para plataformas donde la confianza es primordial.
  • Mejorar la productividad y el enfoque. Aplica el azul marino en aplicaciones relacionadas con el trabajo o el estudio, herramientas de gestión de proyectos o cualquier interfaz donde la concentración sea clave. Con efectos calmantes que ayudan a reducir el estrés y aumentar el enfoque, es perfecto para fondos de paneles de control o barras de menú.
  • Crear una estética profesional. La elegancia y sofisticación del azul marino se prestan bien a sitios de redes profesionales, sitios web corporativos o plataformas de servicios premium. Úsalo para encabezados, pies de página y elementos clave de la interfaz para elevar el diseño general.
  • Equilibrar con colores complementarios. Combina el azul marino con tonos más cálidos como coral, crema u oro para un esquema de color equilibrado y atractivo. Este enfoque puede añadir vitalidad al diseño, haciendo que los botones de llamada a la acción o los destacados resalten sin abrumar al usuario.

Ten en cuenta que el color y su significado pueden variar según la cultura y el contexto. Si diseñas para una audiencia internacional, investiga cómo se perciben los colores en cada país.

Para variaciones dentro del mismo espectro profundo y autoritario que el azul marino, considera:

  • Azul oscuro (#191970) es ligeramente más oscuro, asemejándose al cielo a medianoche, ofreciendo una profundidad similar al azul marino.
  • Azul real (#305CDE) introduce una calidad más vibrante y luminosa, manteniendo la esencia digna del azul marino.
  • Índigo (#560591) fusiona el azul profundo del marino con un toque de violeta, presentando una alternativa mística e introspectiva.
  • Azul prusia (#003153) ofrece un toque más verde, resultando en un tono que es tanto imponente como ligeramente más suave que el azul marino.

Para complementar los tonos profundos del azul marino, considera combinarlo con:

  • Blanco (#FFFFFF) proporciona un contraste limpio y marcado que resalta la sofisticación del azul marino.
  • Oro (#EFBF04) añade un toque de lujo, creando una paleta regia y refinada cuando se combina con azul marino.
  • Beige cálido (#F5F5DC) introduce un equilibrio neutral y terroso que suaviza la intensidad del azul marino sin disminuir su elegancia.
  • Gris frío (#CBCBCB) ofrece un fondo moderno y discreto que permite al azul marino destacar en un entorno contemporáneo.
  • Coral (#FF7F50) aporta un contraste vibrante y animado, infundiendo energía en la calma compuesta del azul marino.

Otros colores que vale la pena considerar incluyen verde salvia para un aspecto natural y armonioso; plata para un giro moderno y elegante; y naranja quemado para un ambiente otoñal audaz.

Aunque el azul marino es versátil, puede chocar con:

  • Verde brillante (#00FF00) puede ser demasiado vibrante y puede restar elegancia al azul marino, creando un efecto visual discordante.
  • Rosa neón (#FF1493) presenta un contraste excesivamente brillante que puede abrumar la sofisticación natural del azul marino.
  • Azul eléctrico (#7DF9FF), con su alta intensidad, podría competir con la profundidad del azul marino, llevando a una experiencia visual discordante.
  • Morado (#800080), aunque rico, puede crear una paleta pesada cuando se combina con azul marino, potencialmente llevando a una atmósfera sombría.
  • Amarillo lima (#CCFF00), con su tono brillante y ácido, puede romper la armonía del azul marino, llevando a un equilibrio incómodo y chocante.

El azul marino se asocia comúnmente con la autoridad y el profesionalismo. Transmite estabilidad, fiabilidad y sofisticación. Este color a menudo representa profundidad y experiencia.

En la psicología del color, se cree que el azul marino promueve la claridad mental y la concentración. Se considera un color de intelecto, sabiduría y poder. El tono profundo de azul tiene un efecto calmante que puede ayudar a enfocar los pensamientos, reducir el estrés y aumentar la productividad.

El azul marino es una elección popular en el diseño de UI/UX, particularmente para la marca corporativa y plataformas educativas. A menudo se utiliza para comunicar confiabilidad y profesionalismo. En el diseño digital, el azul marino puede usarse como color de marca para establecer una base sólida o como color de acento para resaltar características clave. Combina bien con muchos otros colores, proporcionando contraste e interés visual mientras mantiene un aire de formalidad y elegancia.

El azul marino tiene una rica historia que se remonta a 1748 cuando fue elegido deliberadamente para los uniformes de la Marina Real Británica. La decisión se basó en sus propiedades de solidez del color y su practicidad para camuflar la suciedad y el desgaste, lo que lo hacía una elección ideal para largos viajes oceánicos. La adopción del azul marino por la Marina Real estableció su fuerte asociación con la autoridad marítima y la disciplina, y llevó a otras marinas en todo el mundo a adoptar esquemas de color similares.

Para el siglo XX, el azul marino pasó de ser un color marítimo a un elemento básico en los guardarropas civiles. El color simbolizaba la elegancia discreta en la moda, la vestimenta de negocios e incluso el diseño de interiores. Equilibra sus orígenes en la utilidad naval con un atractivo moderno de sofisticación, convirtiéndolo en un color versátil que ha resistido la prueba del tiempo. El azul marino sigue siendo venerado por su profundidad y versatilidad, uniendo la brecha entre el diseño tradicional y contemporáneo.

Variantes de color

Sombras

Tintes

Tonos

Matices

Armonías de color

Complementario

Dividido

Monocromático

Análogo

Triádico

Cuadrado

Paletas personalizadas

Azules Obsidiana

Brillo Nocturno

Mancha de Tinta

Verificador de contraste

Contraste 16,01

Texto grande

#000080

Texto normal

Tu forma de diseñar, alinear y crear importa. Hazlo todo con Figma.

Este es el texto #000080 en un fondo #FFFFFF.
Categoría
Aprobado
Aprobado
Aprobado
Aprobado
Aprobado
Aprobado

Contraste 1,31

Texto grande

#000080

Texto normal

Tu forma de diseñar, alinear y crear importa. Hazlo todo con Figma.

Este es el texto #000080 en un fondo #000000.
Categoría
Desaprobado
Desaprobado
Desaprobado
Desaprobado
Desaprobado
Desaprobado

Simulaciones de color

Protanopia

Deuteranopia

Tritanopia

Acromatopsia

El color hexadecimal #000080, también conocido como azul marino, tiene valores RGB de R:0, G:0, B:128 y valores CMYK de C:100, M:100, Y:0, K:50.

VALUECSS
HEX#000080#000080
RGB DECIMAL0, 0, 128RGB(0,0,128)
RGB PERCENTAGE0.0, 0.0, 50.2RGB(0.0%,0.0%,50.2%)
CMYK100, 100, 0, 50
HSLHSL(240.0, 100.0%, 25.1%)HSL(240.0, 100.0%, 25.1%)
HSV (OR HSB)240.0°, 100.0, 50.2
WEB SAFE#00153#00153
BINARY00000000, 00000000, 10000000
iOS - SwiftUIColor(red: 0.000, green: 0.000, blue: 0.502)
iOS - UIKitUIColor(red: 0.000, green: 0.000, blue: 0.502, alpha: 1)
Android - ComposeColor(0xFF000080)
Crear paleta de colores