Paleta de color azul en html

Los tonos azules, son muy utilizados actualmente, el color azul inspira confianza, profesionalismo, fidelidad, armonía...

Se trata de un color muy utilizado en la mayoría de las aplicaciones o sitios web que usamos a diario: Twitter, Telegram y Facebook son los principales exponentes en Internet del uso de este color. También herramienas como Google Docs, Hootsuite y Buffer lo emplean en sus presentaciones.

En el nicho de la medicina, también es habitual el uso del color azul en sus distintas tonalidades.

En Tu Empresa Online, también usamos el azul. Según los estudios, el ojo humano distingue 110 tonalidades distintas. Casi nada, ¿Verdad?

Pero bueno, a lo que vinimos. Hoy no voy a colocar las 110 tonalidades del color azul acá, sin embargo, hablaré de los distintos tonos de color azul reconocidos por el estándar HTML, y que puedes aplicar en tu sitio web mediante el uso de CSS.

El color azul en HTML:

Como lo hemos definido en otras entradas de este blog, existen varios sistemas a través de los cuales podemos generar colores por medio de códigos. En el diseño web tienden a usarse mayormente lo sistemas RGB y Hexadecimal o HEX, que es su abreviatura.

En estos dos sistemas, el color azul se representa en el tercer valor correspondiente de cada uno.

El color azul en RGB:

En el sistema RGB, se encuentra representado por la tercera cifra dentro del paréntesis, por lo tanto, para tener un azul puro máximo, utilizaremos el valor:

RGB (0, 0, 255).

Donde 255 corresponde al valor más alto.

El color azul en Hexadecimal:

Tal como dijimos anteriormente, lo ubicamos en el tercer valor, o en este caso, los dos últimos caracteres de nuestro código hexadecimal, por lo tanto, para generar un valor de azul puro idéntico al anterior, usaremos la siguiente expresión:

#0000FF 

Donde "FF" corresponde al valor más alto.

El estándar de nombres en HTML:

El estándar HTML (según W3C), reconoce 16 nombres para los tonos de color azul, los cuales pueden ser aplicados en el diseño web referenciándolos por su nombre literal, código RGB o código HEX. Habitualmente los diseñadores web presentamos paletas que contienen estos nombres para hacer más sencilla la selección del color por parte de los clientes.

A continuación, veremos los distintos nombres con los códigos que corresponden a cada uno:

• ✔️cadetblue #5F9EA0 RGB (95, 158, 160)
• ✔️steelblue #4682B4 RGB (70, 130, 180)
• ✔️lightsteelblue #B0C4DE RGB (176, 196, 222)
• ✔️lightblue #ADD8E6 RGB (173, 216, 230)
• ✔️powderblue #B0E0E6 RGB (176, 224, 230)
• ✔️lightskyblue #87CEFA RGB (135, 206, 250)
• ✔️skyblue #87CEEB RGB (135, 206, 235)
• ✔️cornflowerblue #6495ED RGB (100, 149, 237)
• ✔️deepskyblue #00BFFF RGB (0, 191, 255)
• ✔️dodgerblue #1E90FF RGB (30, 144, 255)
• ✔️royalblue #4169E1 RGB (65, 105, 225)
• ✔️blue #0000FF RGB (0, 0, 255)
• ✔️mediumblue #0000CD RGB (0, 0, 205)
• ✔️darkblue #00008B RGB (0, 0, 139)
• ✔️navy #000080 RGB (0, 0, 128)
• ✔️midnightblue #191970 RGB (25, 25, 112)

Nuestros colores:

Seguro habrás encontrado alguna similitud con los colores que usamos acá, sin embargo los tonos que hay allí descritos son una mínima porción de todos los que puedes crear con un selector de colores.

En este caso, los nuestros son #00bcc8 para el azul claro, y #000441 para el azul oscuro (el cual no usamos mucho).

También usamos un tono de rojo, del cual hablaremos en un post especializado para la paleta de colores rojos. 

Variaciones del color azul:

Como dijimos anteriormente, los valores que tenemos en este artículo, corresponden a los nombres soportados por HTML. Se pueden obtener distintos tonos de color azul al modificar los valores correspondientes al rojo y al verde, los cuales se encuentran en el primero y segundo lugar, de izquierda a derecha, respectivamente.

A continuación te dejo una imagen con la paleta de colores azules y su respectivo nombre:

El color azul en el sector inmobiliario:

Las empresas y agentes inmobiliarios que se decantan por el color azul, son asociados directamente con propiedades como oficinas, locales comerciales o edificios corporativos. 

Este color también tiene una estrecha relación con los temas relacionados a inversiones, ya que produce confianza y proyecta profesionalismo, como lo decimos más arriba.

Existen distintas paletas que incluyen el color azul y que puedes usar para tu marca personal o comercial en el sector inmobiliario, hablamos más del tema en nuestro post sobre paletas de colores para inmobiliarias, échale un vistazo.

Comenta, ¿Cuál de todos estos tonos te gusta más?

Recuerda que si necesitas modificar, editar, cambiar o agregar alguno de estos u otros colores a tu sitio web o blog, y no sabes como hacerlo, puedes enviarnos un mensaje a través del formulario de contacto especificando en el asunto el motivo de tu solicitud.