HTML - Colores

Los colores son muy importantes para darle una buena apariencia a su sitio web. Puede especificar colores a nivel de página usando la etiqueta <body> o puede establecer colores para etiquetas individuales usandobgcolor atributo.

La etiqueta <body> tiene los siguientes atributos que se pueden usar para establecer diferentes colores:

bgcolor : Establece un color para el fondo de la página.
text : Establece un color para el cuerpo del texto.
alink : Establece un color para enlaces activos o enlaces seleccionados.
link : Establece un color para el texto vinculado.
vlink: Establece un color para los enlaces visitados , es decir, para el texto vinculado en el que ya ha hecho clic.

Métodos de codificación de color HTML

Existen tres métodos diferentes para establecer colores en su página web:

Color names - Puede especificar nombres de colores directamente como verde, azul o rojo.
Hex codes - Un código de seis dígitos que representa la cantidad de rojo, verde y azul que compone el color.
Color decimal or percentage values - Este valor se especifica mediante la propiedad rgb ().

Ahora veremos estos esquemas de coloración uno por uno.

Colores HTML - Nombres de colores

Puede especificar un nombre de color directo para establecer el texto o el color de fondo. El W3C ha enumerado 16 nombres de colores básicos que se validarán con un validador de HTML, pero hay más de 200 nombres de colores diferentes admitidos por los principales navegadores.

Note- Consulte una lista completa de nombres de colores HTML.

Estándar W3C 16 colores

Aquí está la lista de nombres de 16 colores estándar del W3C y se recomienda usarlos.

Negro	gris	Plata	Blanco
Amarillo	Lima	Agua	Fucsia
rojo	Verde	Azul	Púrpura
Granate	Aceituna	Armada	Verde azulado

Ejemplo

Estos son los ejemplos para establecer el fondo de una etiqueta HTML por nombre de color:

<!DOCTYPE html>
<html>

   <head>
      <title>HTML Colors by Name</title>
   </head>
	
   <body text = "blue" bgcolor = "green">
      <p>Use different color names for for body and table and see the result.</p>
      
      <table bgcolor = "black">
         <tr>
            <td>
               <font color = "white">This text will appear white on black background.</font>
            </td>
         </tr>
      </table>
   </body>
   
</html>

Colores HTML - Códigos hexadecimales

Un hexadecimal es una representación de 6 dígitos de un color. Los dos primeros dígitos (RR) representan un valor rojo, los dos siguientes son un valor verde (GG) y los últimos son el valor azul (BB).

Se puede tomar un valor hexadecimal de cualquier software de gráficos como Adobe Photoshop, Paintshop Pro o MS Paint.

Cada código hexadecimal estará precedido por un signo de almohadilla o almohadilla #. A continuación se muestra una lista de algunos colores que utilizan notación hexadecimal.

Color	Color HEX
	# 000000
	# FF0000
	# 00FF00
	# 0000FF
	# FFFF00
	# 00FFFF
	# FF00FF
	# C0C0C0
	#FFFFFF

Ejemplo

Estos son los ejemplos para establecer el fondo de una etiqueta HTML por código de color en hexadecimal:

<!DOCTYPE html>
<html>

   <head>
      <title>HTML Colors by Hex</title>
   </head>
	
   <body text = "#0000FF" bgcolor = "#00FF00">
      <p>Use different color hexa for for body and table and see the result.</p>
      
      <table bgcolor = "#000000">
         <tr>
            <td>
               <font color = "#FFFFFF">This text will appear white on black background.</font>
            </td>
         </tr>
      </table>
   </body>
   
</html>

Colores HTML - Valores RGB

Este valor de color se especifica mediante el rgb( )propiedad. Esta propiedad toma tres valores, uno para el rojo, el verde y el azul. El valor puede ser un número entero entre 0 y 255 o un porcentaje.

Note - Todos los navegadores no admiten la propiedad de color rgb () por lo que se recomienda no utilizarlo.

A continuación se muestra una lista para mostrar algunos colores utilizando valores RGB.

Color	Color RGB
	rgb (0,0,0)
	rgb (255,0,0)
	rgb (0,255,0)
	rgb (0,0,255)
	rgb (255,255,0)
	rgb (0,255,255)
	rgb (255,0,255)
	rgb (192,192,192)
	rgb (255,255,255)

Ejemplo

Aquí están los ejemplos para establecer el fondo de una etiqueta HTML por código de color usando valores rgb ():

<!DOCTYPE html>
<html>

   <head>
      <title>HTML Colors by RGB code</title>
   </head>
	
   <body text = "rgb(0,0,255)" bgcolor = "rgb(0,255,0)">
      <p>Use different color code for for body and table and see the result.</p>
      
      <table bgcolor = "rgb(0,0,0)">
         <tr>
            <td>
               <font color = "rgb(255,255,255)">This text will appear white on black background.</font>
            </td>
         </tr>
      </table>
   </body>
   
</html>

Colores seguros del navegador

Aquí está la lista de 216 colores que se supone que son los colores más seguros e independientes de la computadora. Estos colores van desde el código hexadecimal 000000 hasta FFFFFF y serán compatibles con todas las computadoras que tengan una paleta de 256 colores.

000000	000033	000066	000099	0000CC	0000FF
003300	003333	003366	003399	0033CC	0033FF
006600	006633	006666	006699	0066CC	0066FF
009900	009933	009966	009999	0099CC	0099FF
00CC00	00CC33	00CC66	00CC99	00CCCC	00CCFF
00FF00	00FF33	00FF66	00FF99	00FFCC	00FFFF
330000	330033	330066	330099	3300CC	3300FF
333300	333333	333366	333399	3333CC	3333FF
336600	336633	336666	336699	3366CC	3366FF
339900	339933	339966	339999	3399CC	3399FF
33CC00	33CC33	33CC66	33CC99	33CCCC	33CCFF
33FF00	33FF33	33FF66	33FF99	33FFCC	33FFFF
660000	660033	660066	660099	6600CC	6600FF
663300	663333	663366	663399	6633CC	6633FF
666600	666633	666666	666699	6666CC	6666FF
669900	669933	669966	669999	6699CC	6699FF
66CC00	66CC33	66CC66	66CC99	66CCCC	66CCFF
66FF00	66FF33	66FF66	66FF99	66FFCC	66FFFF
990000	990033	990066	990099	9900CC	9900FF
993300	993333	993366	993399	9933CC	9933FF
996600	996633	996666	996699	9966CC	9966FF
999900	999933	999966	999999	9999CC	9999FF
99CC00	99CC33	99CC66	99CC99	99CCCC	99CCFF
99FF00	99FF33	99FF66	99FF99	99FFCC	99FFFF
CC0000	CC0033	CC0066	CC0099	CC00CC	CC00FF
CC3300	CC3333	CC3366	CC3399	CC33CC	CC33FF
CC6600	CC6633	CC6666	CC6699	CC66CC	CC66FF
CC9900	CC9933	CC9966	CC9999	CC99CC	CC99FF
CCCC00	CCCC33	CCCC66	CCCC99	Literalmente	CCCCFF
CCFF00	CCFF33	CCFF66	CCFF99	CCFFCC	CCFFFF
FF0000	FF0033	FF0066	FF0099	FF00CC	FF00FF
FF3300	FF3333	FF3366	FF3399	FF33CC	FF33FF
FF6600	FF6633	FF6666	FF6699	FF66CC	FF66FF
FF9900	FF9933	FF9966	FF9999	FF99CC	FF99FF
FFCC00	FFCC33	FFCC66	FFCC99	FFCCCC	FFCCFF
FFFF00	FFFF33	FFFF66	FFFF99	FFFFCC	FFFFFF

↰ Previous page Next page ↱