Degradado azul marino: códigos oscuros y de confianza

Un degradado azul marino mezcla azules profundos, normalmente de un marino casi negro como #0b1630 a un azul real o índigo más vivo. Transmite calma, seriedad y fiabilidad, y hace que el texto blanco se vea nítido. El problema es que el azul marino está en todas partes en finanzas, derecho y diseño corporativo, así que un fundido marino plano suele parecer un valor por defecto. Los códigos de abajo dan al marino luz, temperatura y un acento, de modo que conserva la confianza y gana personalidad.

Códigos clásicos de degradado azul marino

Son los de siempre, cercanos al azul marino puro, con solo el movimiento justo para que no parezcan un relleno liso. Son ideales para diapositivas, informes anuales, cabeceras de email y pies de página web.

Degradados azul marino con un toque de color

Inclina el azul marino unos grados hacia el violeta y se vuelve noche y lujo; inclínalo hacia el verde azulado y se vuelve mar y tecnología. Cualquiera de los dos cambios hace que parezca elegido. El extremo más vivo debería seguir siendo lo bastante profundo para texto blanco en casi toda la superficie.

Azul marino con oro, cobre o plata

Pocos fondos admiten mejor un acento metálico que el azul marino. El oro sobre marino es tradicional y festivo; el cobre es más cálido y moderno; la plata es fría y discreta. Mantén el metal pequeño, como una luz en una esquina o una línea fina, para que el marino siga haciendo la mayor parte del trabajo. Los degradados dorados y los degradados plateados muestran el lado metálico en detalle.

Degradados azul marino de medianoche para la noche y el lujo

Las mezclas radiales recuerdan un cielo tras la puesta de sol o una sala con poca luz. Van bien con invitaciones de gala, bares de hotel, joyería, relojes y radio nocturna. Para la versión estrellada, consulta los degradados de cielo nocturno.

Dónde se ganan su sitio los degradados azul marino

El azul marino rinde al máximo donde importan más las palabras que la imagen, porque da al texto un fondo sereno y de alto contraste. Algunos usos para copiar:

• Diapositivas de 1920×1080: «Marino clásico» para las separatas de sección, con una línea dorada bajo cada título.
• Banner de perfil de LinkedIn de 1584×396: «Marino y verde azulado» de izquierda a derecha, lo más oscuro detrás de tu foto.
• Cabecera de email de 1200×600: «Marino tinta» con un titular en marfil, para que la cabecera ya encaje en bandejas de entrada en modo oscuro.
• Invitaciones de graduación y premios: «Luz dorada sobre marino» impreso en un folleto A5.
• Gráficos y paneles: un fondo azul marino profundo hace fáciles de distinguir los colores vivos de los datos.

Cómo hacer que el azul marino parezca menos corporativo

Ninguno de estos cambios cuesta confianza. Solo hacen que la marca se reconozca de un vistazo, algo importante cuando todos los competidores usan el mismo azul. Los activos de marca distintivos explican por qué el reconocimiento viene de poseer algo que nadie más usa. Una prueba útil: tapa tu logotipo y pregúntate si alguien aún sabría que el diseño es tuyo. Con un fundido marino plano, la respuesta casi siempre es no.

CSS de degradado azul marino sin banding

Las mezclas oscuras y sutiles son donde más se nota el banding: ves escalones visibles en lugar de un fundido suave, sobre todo cuando una plataforma vuelve a comprimir tu imagen. En la web, unas paradas extra y una capa de grano lo disimulan. El banding en degradados explica la causa.

.hero-navy {
  position: relative;
  background-color: #0b1630; /* fallback */
  background-image:
    radial-gradient(circle at 85% 15%, rgb(212 166 74 / 0.35) 0%, transparent 35%),
    linear-gradient(160deg, #1e3a8a 0%, #172554 45%, #0f1d3a 75%, #0b1630 100%);
  color: #f8f6f1;
}

/* fine grain on top to break up banding */
.hero-navy::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.08;
  background-image: url("/grain.png"); /* a small tiling noise image */
}

El texto es la parte fácil con el azul marino. El blanco y el marfil superan el contraste con holgura en todos los marinos de arriba, y el oro viejo #d4a64a se lee a unos 8 a 1 sobre medianoche, así que sirve para títulos. Lo que hay que vigilar es el azul vivo: un azul medio como #3b82f6 detrás de texto blanco baja a unos 3,7 a 1. En Gradiently, la tinta automática se ocupa de esto línea a línea, eligiendo el texto de la propia paleta del Mark, y el Designer puede maquetar toda una campaña marino con la voz de tu kit de marca.