función rgb() de CSS

definición y uso

CSS rgb() la función, utilizando el modelo de color rojo-verde-azul (RGB). También se puede agregar un canal de transparencia opcional (que representa la transparencia del color).

El valor de color RGB se especifica a través de rgb(rojo verde azul) Especificar. Cada parámetro define la intensidad del color, que puede ser un entero entre 0 y 255 o un porcentaje entre 0% y 100%.

Por ejemplo, el valor rgb(0 0 255) se presenta en azul, porque el parámetro azul está configurado al valor máximo (255), mientras que los otros parámetros están configurados en 0.

Nota:rgba() La función es rgb() Alias de la función. Se recomienda usar rgb() Función.

Ejemplo

Define diferentes colores RGB(A):

#p1 {background-color:rgb(255 0 0);} /* Rojo */
#p2 {background-color:rgb(0 255 0);} /* Verde */
#p3 {background-color:rgb(0 0 255);} /* Azul */
#p4 {background-color:rgb(192 192 192);} /* Gris */
#p5 {background-color:rgb(255 255 0);} /* Amarillo */
#p6 {background-color:rgb(255 0 255);} /* Color cereza */
#p7 {background-color:rgb(255 0 255 / 0.2);} /* Color cereza con transparencia */
#p8 {background-color:rgb(0 0 255 / 50%);} /* Azul con transparencia */

Prueba personalmente

Sintaxis de CSS

Sintaxis de valor absoluto

rgb(R G B / A)
Valor Descripción
R

Obligatorio. Define la intensidad del rojo, puede ser un entero entre 0 y 255 o un porcentaje entre 0% y 100%.

También se puede usar none (equivalente a 0%).
G

Obligatorio. Define la intensidad del verde, puede ser un entero entre 0 y 255 o un porcentaje entre 0% y 100%.

También se puede usar none (equivalente a 0%).
B

Obligatorio. Define la intensidad del azul, puede ser un entero entre 0 y 255 o un porcentaje entre 0% y 100%.

También se puede usar none (equivalente a 0%).
/ A

Opcional. Representa el valor del canal de transparencia del color, 0% (o 0) representa completamente transparente, 100% (o 1) representa completamente opaco.

También se puede usar none (que representa un canal de transparencia sin). El valor predeterminado es 100%.

Sintaxis de valor relativo

rgb(from color R G B / A)
Valor Descripción
from color

Empieza con el keyword from, seguido del valor del color que representa el color original.

Este es el color original en el que se basa el color relativo.
R

Obligatorio. Define la intensidad del rojo, puede ser un entero entre 0 y 255 o un porcentaje entre 0% y 100%.

También se puede usar none (equivalente a 0%).
G

Obligatorio. Define la intensidad del verde, puede ser un entero entre 0 y 255 o un porcentaje entre 0% y 100%.

También se puede usar none (equivalente a 0%).
B

Obligatorio. Define la intensidad del azul, puede ser un entero entre 0 y 255 o un porcentaje entre 0% y 100%.

También se puede usar none (equivalente a 0%).
/ A

Opcional. Representa el valor del canal de transparencia del color, 0% (o 0) representa completamente transparente, 100% (o 1) representa completamente opaco.

También se puede usar none (que representa un canal de transparencia sin). El valor predeterminado es 100%.

Detalles técnicos

Versión: CSS2

Compatibilidad del navegador

Los números en la tabla representan la versión del navegador que admite completamente la función.

Chrome Edge Firefox Safari Opera
rgb()
1 4 1 1 3.5
rgb() con parámetro de transparencia
65 79 52 12.1 52
Espacios separados por parámetros
65 79 52 12.1 52