Degradado cian: códigos nítidos y eléctricos

Un degradado cian mezcla el color brillante a medio camino entre el verde y el azul con uno de sus vecinos: blanco para el hielo, azul para un aire tecnológico eléctrico, lima para la frescura, magenta para un toque cyber o un azul marino profundo donde el cian parece brillar. El cian puro de pantalla es #00ffff, y es mucho más claro de lo que casi todo el mundo espera, así que la habilidad principal es decidir dónde van las palabras. A continuación tienes códigos para copiar de cada estilo, con las cifras de contraste que importan.

Cian, verde azulado y turquesa no son lo mismo

Estos tres se confunden constantemente, y la diferencia importa cuando pasas un encargo a un diseñador o eliges un código. CSS incluso tiene nombre para los tres, y son claramente distintos. El cian es el más luminoso y el más equilibrado entre verde y azul. El turquesa es más suave y algo más verde, como la piedra. El verde azulado es mucho más oscuro y sereno.

Para los parientes más tranquilos, mira degradado verde azulado y degradado turquesa. Este artículo se queda en el extremo luminoso.

Códigos de degradado cian hielo y piscina

El extremo claro del cian recuerda al agua fría y al aire limpio. Hielo es casi blanco con un toque de color; glaciar y piscina van más hondo, pasando por un cian brillante hasta un azul verdoso que admite texto blanco abajo. Encajan en ofertas de verano, cosmética con un relato refrescante, bebidas y todo lo que quiera transmitir frescor.

Cian eléctrico sobre fondos oscuros

El cian se vuelve eléctrico cuando se apoya en la oscuridad. Una pequeña luz cian sobre un fondo casi negro o azul marino parece una pantalla, un láser o una visualización de datos, y por eso está en todas partes en software, videojuegos y ciencia. Mantén oscura la mayor parte del encuadre y deja que el cian ocupe una esquina o un borde. El degradado cian azul de esta serie es el más versátil de todos, luminoso en un extremo y azul intenso en el otro.

Para esquemas completos basados en este estilo, paletas de colores tecnológicas tiene varios, y degradados neón lo lleva más hacia la noche.

Cian con lima y con magenta

Del cian a la lima se pasa por el menta, y el resultado es deportivo, fresco y optimista. Cian con magenta es la pareja cyberpunk: dos de los tres primarios de impresión, ambos a todo volumen. Pásala por un centro añil oscuro y parecerá una calle de neón de noche en lugar de un juguete infantil. El artículo degradado magenta cubre el otro lado de esta pareja.

La trampa del contraste: palabras sobre cian

El cian es uno de los colores saturados más claros que puede mostrar una pantalla. El texto blanco sobre #00ffff puro tiene un contraste de solo 1,3 a 1, ilegible, mientras que el negro sobre el mismo cian llega a unos 16,7 a 1. El blanco empieza a funcionar cuando el cian se oscurece hasta alrededor de #0e7490, donde alcanza aproximadamente 5,4 a 1. Contraste de color y accesibilidad explica las proporciones y los objetivos.

Este es el tipo de criterio que Gradiently aplica por ti. La tinta automática elige texto claro u oscuro para cada línea a partir de la propia paleta del Mark, y el Mark coloca su zona más tranquila y de mejor contraste detrás de las palabras, así que un fondo cian brillante nunca deja el texto blanco a la deriva.

Un borde degradado cian en CSS

En interfaces oscuras, el cian funciona de maravilla como borde en lugar de relleno. Un borde degradado mantiene legible la tarjeta y añade el toque eléctrico. Este usa dos fondos, uno recortado al padding y otro al borde, así que conserva las esquinas redondeadas.

.card {
  border: 2px solid transparent;
  border-radius: 16px;
  background:
    linear-gradient(#0b1220, #0b1220) padding-box,
    linear-gradient(135deg, #00e5ff 0%, #2563eb 100%) border-box;
  color: #e6f9ff;
}

Tienes más técnicas, incluidos bordes animados, en borde degradado CSS.

Dónde encaja un degradado cian

El cian es una elección natural para lanzamientos de software, herramientas para desarrolladores, videojuegos, ropa de baño, bebidas y todo lo que quiera parecer rápido o frío. El día del lanzamiento, mantén un mismo estilo cian en la publicación del anuncio, la vista previa del enlace y el banner del registro de cambios para que la gente lo reconozca en cada feed. Branding para startups SaaS muestra cómo construir toda una identidad en torno a un color luminoso como este.