Todo sobre los colores html (hexadecimales)

maquetado web colores para html i css

Son códigos numéricos que representan los diferentes colores usados en el lenguaje html y CSS para el diseño web.

En html cada color se forma con la mezcla de los tres colores primarios en el siguiente orden: rojo, verde y azul (colores RGB).

Estos tres colores se combinan jugando con sus diferentes intensidades y expresando la cantidad de cada uno con valores numéricos RGB que oscilan entre 0 y 255.

Para html la notación específica de los colores RGB; que se expresan en notación decimal; en se indican con numeración hexadecimal en base 16.

Simplificando mucho el tema y sin entrar en explicaciones profundas, mostraremos la equivalencias del sistema hexadecimal teniendo en cuenta que no permite dígitos de más de dos cifras por color (porque manejan números binarios) y por ellos se reemplazan números por letras, así: #ffffff (código hexadecimal del color blanco)

Cuántos colores existen?

Veamos, si cada color puede tener un valor entre 0 y 255 el número máximo de combinaciones posibles es:

256 x 256 x 256 = 16.77.216 millones de colores.

Es una cifra mareante verdad?

Código de colores html

Hemos dicho que estos colores se crean a partir de la combinación del rojo, verde y azul y que los valores varían del 0 al 255, siendo 0 la cantidad mínima de color y 255 la cantidad máxima.

Ahora bien, un código de color html se representa de la siguiente forma:

Color= intensidad color rojo + intensidad color verde + intensidad color azul

Color html red hex#ff0000
Color html green hex #00ff00
color html blue hex #0000ff

Utilizando las equivalencias de los valores RGB en la escala hexadecimal el código quedaría así #FF0000 para el color rojo más intenso, #00FF00 para el color verde más intenso y #0000FF para el azul más intenso.

De la misma manera en cuanto al tono del color, este puede variar aumentando o disminuyendo los valores de 00 hasta 99, por ejemplo, #990000 en el caso de una variación del rojo más intenso a un rojo con tonalidad más oscura.

color html red intenso #990000
color html Green Intenso hex #009900
Color html blue intenso hex #000099

Colores html y diseño web

En desarrollo de páginas web se utilizan las especificaciones de los códigos HTML (HyperText Markup Language, es decir, Lenguaje de Marcas de Hipertexto) y CSS (Cascading Style Sheets, u Hojas de Estilo en Cascada desarrollado por W3C).

Se hace ésta separación para diferenciar la estructura de la página web del estilo.

Se han definido entonces 140 colores para los códigos html y css, denominados colores web.

Se pueden basar sobre los sistemas de color RGB o HSL. En el código CSS (y antes en HTML) son especificados como valores numéricos, aunque indistintamente pueden ser usados por el nombre en ingles, el código RGB o el código hexadecimal.

Todos los nombre de los colores en ingles y castellano con sus códigos RGB y hex, los encontrarás aquí para que los incorpores como quieras en tus diseños.

También puedes utilizar la lista inferior para conocer en detalle las armonías cromáticas de cada color.

Lista de nombres en ingles de los 140 colores web

  • Dim Grey
  • Slate Blue
  • Olive Drab
  • Slate Gray
  • Slate Grey
  • Light Slate Gray
  • Light Slate Grey
  • Medium Slate Blue
  • Lawn Green
  • Chartreuse
  • Aquamarine
  • Maroon
  • Purple
  • Gray
  • Grey
  • Sky Blue
  • Light Sky Blue
  • Blue Violet
  • Dark Magenta
  • Saddle Brown
  • Dark Sea Green
  • Light Green
  • Medium Purple
  • Dark Violet
  • Pale Green
  • Dark Orchid
  • Yellow Green
  • Sienna
  • Brown
  • Dark Gray
  • Dark Grey
  • Light Blue
  • Green Yellow
  • Light Steel Blue
  • Powder Blue
  • Fire Brick
  • Dark Golden Rod
  • Medium Orchid
  • Rosy Brown
  • Dark Khaki
  • Silver
  • Medium Violet Red
  • Indian Red
  • Peru
  • Chocolate
  • Tan
  • Light Gray
  • Light Grey
  • Thistle
  • Orchid
  • Golden Rod
  • Pale Violet Red
  • Crimson
  • Plum
  • Burly Wood
  • Light Cyan
  • Lavender
  • Dark salmon
  • Violet
  • Pale Golden Rod
  • Light Coral
  • Khaki
  • Alice Blue
  • Honey Dew
  • Azure
  • Sandy Brown
  • Wheat
  • Beige
  • White Smoke

 

  • Mint Cream
  • Ghost White
  • Salmon
  • Antique White
  • Linen
  • Old Lace
  • Red
  • Fuchsia
  • Magenta
  • Deep pink
  • Orange Red
  • Tomato
  • Hot Pink
  • Coral
  • Dark Orange
  • Light Salmon
  • Orange
  • Light Pink
  • Pink
  • Gold
  • Peach Puff
  • Navajo White
  • Mocassin
  • Bisque
  • Misty Rose
  • Papaya Whip
  • Lavender Blush
  • Sea Shell
  • Cornsilk
  • Lemon Chiffon
  • Floral White
  • Snow
  • Yellow
  • Light Yellow
  • Ivory
  • White

Color pickers para diseño web

En el mundo del diseño web, el color es una parte importante de la estética y el mensaje que se quiere transmitir.

Los colores son una herramienta potente e impactante.

A la hora de diseñar tu página web existen recursos online y gratuitos  que hacen de la selección de la paleta de colores ideal, una tarea muy fácil.

Hemos buscado, analizado y escrito para ti una lista de color picker o generadores de paleta de colores (que será dinámica) para que las pruebes todas y experimentes con tus creaciones.

Tambien te puede interesar: