Cómo encontrar un código de color en HTML

Los colores juegan un papel vital en la transmisión de información de manera no verbal. Un sitio web con colores interactivos se considera atractivo y visualmente atractivo. Existen diferentes métodos para aplicar colores para los elementos HTML: RGB, RGBA, Código Hex, HSLA y HSL. Sin embargo, puede encontrar códigos de color inspeccionando la página, seleccionando los colores del selector de color o utilizando la función Eye Dropper del panel de herramientas de desarrolladores.

En este estudio, discutiremos los métodos para encontrar el código de color en HTML

• Inspeccionando la página
• Mediante la función de gotero para el ojo

Método 1: Encuentre un código de color en HTML inspeccionando la página web

Los siguientes son los pasos para encontrar el código de color inspeccionando la página.

Paso 1: Abra la página web

Primero, abra la página web requerida:

Paso 2: Seleccione la opción Inspeccionar

Haga clic derecho en la página y seleccione el "Inspeccionar"Opción del menú, que proporcionará acceso al"Herramientas de desarrollo"Panel:

Como resultado, el "ElementosLa pestaña se mostrará en la parte inferior del navegador:

Paso 3: ajuste el lugar del panel de herramientas de desarrollador

Al hacer clic en los tres puntos desde la esquina, puede seleccionar la ubicación del panel. Por ejemplo, hemos seleccionado el icono resaltado verde. Además, la ventana Inspeccionar se puede cambiar el tamaño arrastrando sus esquinas:

Paso 4: Seleccione el elemento para inspeccionar

Luego, haga clic en el icono resaltado para seleccionar el elemento que desea inspeccionar:

Paso 5: Elija el elemento

Rover el elemento cuyo código de color debe encontrarse y hacer clic en él. Como resultado, el "Estilos"La pestaña abre y muestra las propiedades de estilo del elemento seleccionado, desde donde debe seleccionar el color como se muestra en el cuadro resaltado verde:

Paso 6: Elija Color de Color Picker

Copie el código de color de la ventana de selección de color abierta:

La imagen a continuación indica que también podemos seleccionar colores haciendo clic en los cuadros de color pequeños resaltados por color rojo. Mientras que la caja amarilla representa un puntero que se cambia gradualmente para ver el color del elemento seleccionado:

Paso 7: Ajuste la opacidad del color

También puede ajustar la opacidad del color como se demuestra en el siguiente GIF:

Método 2: Encuentre un código de color en HTML utilizando la función Eye Dropper

La función Eye Dropper también se puede utilizar para elegir cualquier color de la página web. Esta característica es muy útil, ya que puede seleccionar un color desde cualquier lugar de la ventana que se muestra.

Nota: La función de gotero para el ojo está representada por el cuadro resaltado rojo en la imagen a continuación:

Aquí hay una demostración del funcionamiento de la herramienta Eye Dropper:

Después de seleccionar el color para su elemento, copie el código de color y péguelo en el CSS de su proyecto.

Conclusión

Existen diferentes métodos para aplicar colores para los elementos HTML: RGB, RGBA, Código Hex, HSLA y HSL. Puedes encontrar códigos de color de "Inspección"Cualquier página web o seleccionando colores del"selector de color"Y usando el"Gotero para los ojos" característica. Este artículo ha demostrado el procedimiento para encontrar códigos de color en HTML con ejemplos detallados.