Dear color lovers – together, we’ll have a more colorful future. Support us on

✕

CSS Gradientes:
RGB 80 97 81

Información

cerrar todo

Gradientes de 2 colores - Color complementario

Sugerimos CSS gradientes de dos tonos de color, tal como el color base y el color complementario.

Encuentre ejemplos de transición de colores lineares y radiales.

Diseño web: Copie el código CSS para integración facil a su página web.

Gradientes de 2 colores - Colores más claros

Escoja CSS gradientes de dos tonos de color, tal como uno del color base y un tono más claro.

Encuentre ejemplos de transición de colores lineares y radiales de Colores más claros.

Diseño web: Copie el código CSS para integración fácil en su página web.

Gradientes de 2 colores - Colores más oscuros

Permitanos sugerirle CSS gradientes de dos tonos de color, tal como uno del color base y un tono más claro.

Encuentre ejemplos de transición de colores lineares y radiales de Colores más claros.

Diseño web: Copie el código CSS para integración fácil en su página web.

Mostrar opciones

Descripción

Como el valor de los colores es relativamente bajo comparado con otros, este tono parece ser más oscuro

La descomposición del color en el sistema de color RGB: en este tono de color estan, de entre máximo 255 componentes de colores, respectivamente 80 el rojo, 97 el verde y 81 el azul.

De esta proporción de mezcla resulta un tono de color conveniente en la mitad de la intersección.

Usted puede ver en la representación, como el color se compone de tres elementos: del rojo (arriba), del verde (abajo a la derecha) y del azul (abajo a la izquierda). Puede ver el color resultante en el medio.

El color esta compuesto de la siguiente manera en el sistema de color CMYK: Hay en este tono de color, de entre máximo 100 componentes de colores 18 ciano, ninguno magenta, 16 amarillo y 62 negro.

De esta proporción de mezcla resulta un tono de color conveniente en la mitad de la intersección.

Usted puede ver en la representación, como el color se compone de cuatro elementos: del cian (arriba en la parte izquierda), del magenta (arriba en la parte derecha), del amarillo (abajo en la parte derecha) y del negro o key (abajo en la parte izquierda). Puede ver el color resultante en el medio.

Verificación de su paleta de colores como fabricante.

Proporcione a diseñadores y agencias valores cromáticos precisos.

Vámonos

Gradientes de 2 colores de RGB 80 97 81 - Color complementario

Lineal

HEX #506151 a HEX #AF9EAE

Código CSS:

background-image: linear-gradient(135deg, #506151 5%, #AF9EAE 90%);

Radial

HEX #506151 a HEX #AF9EAE

Código CSS:

background-image: radial-gradient(circle, #506151 9%, #AF9EAE 91%);

HEX #AF9EAE a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #AF9EAE 10%, #506151 98%);

HEX #AF9EAE a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #AF9EAE 12%, #506151 92%);

Gradientes de 2 colores de RGB 80 97 81 - Colores más claros

Lineal

HEX #506151 a HEX #546250

Código CSS:

background-image: linear-gradient(135deg, #506151 9%, #546250 86%);

Radial

HEX #506151 a HEX #546250

Código CSS:

background-image: radial-gradient(circle, #506151 11%, #546250 100%);

HEX #546250 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #546250 3%, #506151 99%);

HEX #546250 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #546250 3%, #506151 92%);

HEX #506151 a HEX #506251

Código CSS:

background-image: linear-gradient(135deg, #506151 2%, #506251 95%);

HEX #506151 a HEX #506251

Código CSS:

background-image: radial-gradient(circle, #506151 14%, #506251 95%);

HEX #506251 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #506251 0%, #506151 100%);

HEX #506251 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #506251 11%, #506151 93%);

HEX #506151 a HEX #506255

Código CSS:

background-image: linear-gradient(135deg, #506151 10%, #506255 93%);

HEX #506151 a HEX #506255

Código CSS:

background-image: radial-gradient(circle, #506151 11%, #506255 92%);

HEX #506255 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #506255 5%, #506151 90%);

HEX #506255 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #506255 0%, #506151 89%);

HEX #506151 a HEX #50625A

Código CSS:

background-image: linear-gradient(135deg, #506151 9%, #50625A 89%);

HEX #506151 a HEX #50625A

Código CSS:

background-image: radial-gradient(circle, #506151 12%, #50625A 95%);

HEX #50625A a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #50625A 5%, #506151 97%);

HEX #50625A a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #50625A 11%, #506151 98%);

Gradientes de 2 colores de RGB 80 97 81 - Colores más oscuros

Lineal

HEX #506151 a HEX #3D4B3E

Código CSS:

background-image: linear-gradient(135deg, #506151 5%, #3D4B3E 92%);

Radial

HEX #506151 a HEX #3D4B3E

Código CSS:

background-image: radial-gradient(circle, #506151 0%, #3D4B3E 97%);

HEX #3D4B3E a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #3D4B3E 11%, #506151 88%);

HEX #3D4B3E a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #3D4B3E 3%, #506151 87%);

HEX #506151 a HEX #506251

Código CSS:

background-image: linear-gradient(135deg, #506151 4%, #506251 93%);

HEX #506151 a HEX #506251

Código CSS:

background-image: radial-gradient(circle, #506151 6%, #506251 88%);

HEX #506251 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #506251 12%, #506151 96%);

HEX #506251 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #506251 0%, #506151 95%);

HEX #506151 a HEX #627864

Código CSS:

background-image: linear-gradient(135deg, #506151 11%, #627864 95%);

HEX #506151 a HEX #627864

Código CSS:

background-image: radial-gradient(circle, #506151 7%, #627864 95%);

HEX #627864 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #627864 8%, #506151 96%);

HEX #627864 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #627864 4%, #506151 87%);

HEX #506151 a HEX #768E77

Código CSS:

background-image: linear-gradient(135deg, #506151 12%, #768E77 90%);

HEX #506151 a HEX #768E77

Código CSS:

background-image: radial-gradient(circle, #506151 6%, #768E77 92%);

HEX #768E77 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #768E77 10%, #506151 95%);

HEX #768E77 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #768E77 1%, #506151 97%);

Gradientes de 2 colores de RGB 80 97 81 - Colores análogos

Lineal

HEX #506151 a HEX #546250

Código CSS:

background-image: linear-gradient(135deg, #506151 6%, #546250 97%);

Radial

HEX #506151 a HEX #546250

Código CSS:

background-image: radial-gradient(circle, #506151 0%, #546250 91%);

HEX #546250 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #546250 1%, #506151 93%);

HEX #546250 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #546250 12%, #506151 88%);

HEX #506151 a HEX #506251

Código CSS:

background-image: linear-gradient(135deg, #506151 0%, #506251 87%);

HEX #506151 a HEX #506251

Código CSS:

background-image: radial-gradient(circle, #506151 10%, #506251 89%);

HEX #506251 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #506251 4%, #506151 100%);

HEX #506251 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #506251 6%, #506151 99%);

HEX #506151 a HEX #506255

Código CSS:

background-image: linear-gradient(135deg, #506151 5%, #506255 97%);

HEX #506151 a HEX #506255

Código CSS:

background-image: radial-gradient(circle, #506151 4%, #506255 97%);

HEX #506255 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #506255 1%, #506151 99%);

HEX #506255 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #506255 3%, #506151 86%);

HEX #506151 a HEX #50625A

Código CSS:

background-image: linear-gradient(135deg, #506151 3%, #50625A 93%);

HEX #506151 a HEX #50625A

Código CSS:

background-image: radial-gradient(circle, #506151 12%, #50625A 88%);

HEX #50625A a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #50625A 5%, #506151 98%);

HEX #50625A a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #50625A 8%, #506151 99%);

Gradientes de 2 colores de RGB 80 97 81 - Colores monocromáticos

Lineal

HEX #506151 a HEX #3D4B3E

Código CSS:

background-image: linear-gradient(135deg, #506151 1%, #3D4B3E 98%);

Radial

HEX #506151 a HEX #3D4B3E

Código CSS:

background-image: radial-gradient(circle, #506151 0%, #3D4B3E 100%);

HEX #3D4B3E a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #3D4B3E 10%, #506151 86%);

HEX #3D4B3E a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #3D4B3E 13%, #506151 91%);

HEX #506151 a HEX #506251

Código CSS:

background-image: linear-gradient(135deg, #506151 11%, #506251 87%);

HEX #506151 a HEX #506251

Código CSS:

background-image: radial-gradient(circle, #506151 10%, #506251 92%);

HEX #506251 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #506251 12%, #506151 97%);

HEX #506251 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #506251 12%, #506151 88%);

HEX #506151 a HEX #627864

Código CSS:

background-image: linear-gradient(135deg, #506151 12%, #627864 96%);

HEX #506151 a HEX #627864

Código CSS:

background-image: radial-gradient(circle, #506151 4%, #627864 88%);

HEX #627864 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #627864 2%, #506151 97%);

HEX #627864 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #627864 8%, #506151 99%);

HEX #506151 a HEX #768E77

Código CSS:

background-image: linear-gradient(135deg, #506151 4%, #768E77 86%);

HEX #506151 a HEX #768E77

Código CSS:

background-image: radial-gradient(circle, #506151 12%, #768E77 95%);

HEX #768E77 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #768E77 14%, #506151 88%);

HEX #768E77 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #768E77 10%, #506151 96%);

Gradientes de 2 colores de RGB 80 97 81 - Colores parcialmente complementarios

Lineal

HEX #506151 a HEX #505D62

Código CSS:

background-image: linear-gradient(135deg, #506151 5%, #505D62 95%);

Radial

HEX #506151 a HEX #505D62

Código CSS:

background-image: radial-gradient(circle, #506151 1%, #505D62 93%);

HEX #505D62 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #505D62 7%, #506151 96%);

HEX #505D62 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #505D62 5%, #506151 96%);

HEX #506151 a HEX #625056

Código CSS:

background-image: linear-gradient(135deg, #506151 3%, #625056 92%);

HEX #506151 a HEX #625056

Código CSS:

background-image: radial-gradient(circle, #506151 13%, #625056 91%);

HEX #625056 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #625056 9%, #506151 94%);

HEX #625056 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #625056 2%, #506151 87%);

Gradientes de 2 colores de RGB 80 97 81 - Colores triádicos

Lineal

HEX #506151 a HEX #515062

Código CSS:

background-image: linear-gradient(135deg, #506151 2%, #515062 86%);

Radial

HEX #506151 a HEX #515062

Código CSS:

background-image: radial-gradient(circle, #506151 9%, #515062 94%);

HEX #515062 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #515062 8%, #506151 95%);

HEX #515062 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #515062 11%, #506151 86%);

HEX #506151 a HEX #625150

Código CSS:

background-image: linear-gradient(135deg, #506151 14%, #625150 89%);

HEX #506151 a HEX #625150

Código CSS:

background-image: radial-gradient(circle, #506151 4%, #625150 87%);

HEX #625150 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #625150 6%, #506151 99%);

HEX #625150 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #625150 9%, #506151 97%);

Gradientes de 2 colores de RGB 80 97 81 - Colores rectangulares (tetradicos)

Lineal

HEX #506151 a HEX #505D62

Código CSS:

background-image: linear-gradient(135deg, #506151 4%, #505D62 94%);

Radial

HEX #506151 a HEX #505D62

Código CSS:

background-image: radial-gradient(circle, #506151 9%, #505D62 89%);

HEX #505D62 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #505D62 11%, #506151 87%);

HEX #505D62 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #505D62 3%, #506151 89%);

HEX #506151 a HEX #625061

Código CSS:

background-image: linear-gradient(135deg, #506151 11%, #625061 86%);

HEX #506151 a HEX #625061

Código CSS:

background-image: radial-gradient(circle, #506151 11%, #625061 88%);

HEX #625061 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #625061 8%, #506151 94%);

HEX #625061 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #625061 2%, #506151 91%);

HEX #506151 a HEX #625450

Código CSS:

background-image: linear-gradient(135deg, #506151 13%, #625450 86%);

HEX #506151 a HEX #625450

Código CSS:

background-image: radial-gradient(circle, #506151 2%, #625450 97%);

HEX #625450 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #625450 14%, #506151 86%);

HEX #625450 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #625450 0%, #506151 90%);

Gradientes de 2 colores de RGB 80 97 81 - Colores cuadrados

Lineal

HEX #506151 a HEX #505862

Código CSS:

background-image: linear-gradient(135deg, #506151 4%, #505862 97%);

Radial

HEX #506151 a HEX #505862

Código CSS:

background-image: radial-gradient(circle, #506151 13%, #505862 98%);

HEX #505862 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #505862 3%, #506151 100%);

HEX #505862 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #505862 8%, #506151 95%);

HEX #506151 a HEX #625061

Código CSS:

background-image: linear-gradient(135deg, #506151 8%, #625061 98%);

HEX #506151 a HEX #625061

Código CSS:

background-image: radial-gradient(circle, #506151 3%, #625061 90%);

HEX #625061 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #625061 10%, #506151 86%);

HEX #625061 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #625061 9%, #506151 97%);

HEX #506151 a HEX #625A50

Código CSS:

background-image: linear-gradient(135deg, #506151 5%, #625A50 92%);

HEX #506151 a HEX #625A50

Código CSS:

background-image: radial-gradient(circle, #506151 12%, #625A50 92%);

HEX #625A50 a HEX #506151

Código CSS:

background-image: linear-gradient(135deg, #625A50 1%, #506151 100%);

HEX #625A50 a HEX #506151

Código CSS:

background-image: radial-gradient(circle, #625A50 0%, #506151 97%);

Mostrar más paletas de colores

Servicios

Colores

RGB a HEX

convierta de RGB rojo verde azul a #RRGGBB

RGB a CMYK

convierta de RGB rojo verde azul a CMYK cian / magenta / amarillo / negro

RGB a RAL®

convierta de RGB rojo verde azul a RAL®-número (RAL 0000)

RGB a HKS®

convierta de RGB rojo verde azul a HKS®-número (HKS 00)

RGB a PANTONE®

convierta de RGB rojo verde azul a Pantone®-número (Pantone 0000)

RGB a Sherwin Williams®

convierta de RGB rojo verde azul a Sherwin Williams®-número (SW 0000)

RGB a NCS®

convierta de RGB rojo verde azul a NCS-número (S0000-X00X)

CMYK a HEX

convierta de CMYK cian / magenta / amarillo / negro a #RRGGBB

CMYK a RGB

convierta de CMYK cian / magenta / amarillo / negro a RGB rojo verde azul

CMYK a RAL®

convierta de CMYK cian / magenta / amarillo / negro a RAL®-número (RAL 0000)

CMYK a HKS®

convierta de CMYK cian / magenta / amarillo / negro a HKS®-número (HKS 00)

CMYK a PANTONE®

convierta de CMYK cian / magenta / amarillo / negro a Pantone®-número (Pantone 0000)

CMYK a Sherwin Williams®

convierta de CMYK cian / magenta / amarillo / negro a Sherwin Williams®-número (SW 0000)

CMYK a NCS®

convierta de CMYK cian / magenta / amarillo / negro a NCS-número (S0000-X00X)

HEX a RGB

convierta de #RRGGBB a RGB rojo verde azul

HEX a CMYK

convierta de #RRGGBB a CMYK cian / magenta / amarillo / negro

HEX a RAL®

convierta de #RRGGBB a RAL®-número (RAL 0000)

HEX a HKS®

convierta de #RRGGBB a HKS®-número (HKS 00)

HEX a PANTONE®

convierta de #RRGGBB a Pantone®-número (Pantone 0000)

HEX a Sherwin Williams®

convierta de #RRGGBB a Sherwin Williams®-número (SW 0000)

HEX a NCS®

convierta de #RRGGBB a NCS-número (S0000-X00X)

RAL® a RGB

convierta de RAL®-número (RAL 0000) a RGB rojo verde azul

RAL® a CMYK

convierta de RAL®-número (RAL 0000) a CMYK cian / magenta / amarillo / negro

RAL® a HEX

convierta de RAL®-número (RAL 0000) a #RRGGBB

RAL® a HKS®

convierta de RAL®-número (RAL 0000) a HKS®-número (HKS 00)

RAL® a PANTONE®

convierta de RAL®-número (RAL 0000) a Pantone®-número (Pantone 0000)

RAL® a Sherwin Williams®

convierta de RAL®-número (RAL 0000) a Sherwin Williams®-número (SW 0000)

RAL® a NCS®

convierta de RAL®-número (RAL 0000) a NCS-número (S0000-X00X)

HKS® a RGB

convierta de HKS®-número (HKS 00) a RGB rojo verde azul

HKS® a CMYK

convierta de HKS®-número (HKS 00) a CMYK cian / magenta / amarillo / negro

HKS® a HEX

convierta de HKS®-número (HKS 00) a #RRGGBB

HKS® a RAL®

convierta de HKS®-número (HKS 00) a RAL®-número (RAL 0000)

HKS® a PANTONE®

convierta de HKS®-número (HKS 00) a Pantone®-número (Pantone 0000)

HKS® a Sherwin Williams®

convierta de HKS®-número (HKS 00) a Sherwin Williams®-número (SW 0000)

HKS® a NCS®

convierta de HKS®-número (HKS 00) a NCS-número (S0000-X00X)

PANTONE® a RGB

convierta de Pantone®-número (Pantone 0000) a RGB rojo verde azul

PANTONE® a CMYK

convierta de Pantone®-número (Pantone 0000) a CMYK cian / magenta / amarillo / negro

PANTONE® a HEX

convierta de Pantone®-número (Pantone 0000) a #RRGGBB

PANTONE® a RAL®

convierta de Pantone®-número (Pantone 0000) a RAL®-número (RAL 0000)

PANTONE® a HKS®

convierta de Pantone®-número (Pantone 0000) a HKS®-número (HKS 00)

PANTONE® a Sherwin Williams®

convierta de Pantone®-número (Pantone 0000) a Sherwin Williams®-número (SW 0000)

PANTONE® a NCS®

convierta de Pantone®-número (Pantone 0000) a NCS-número (S0000-X00X)

Sherwin Williams® a RGB

convierta de Sherwin Williams®-número (SW 0000) a RGB rojo verde azul

Sherwin Williams® a CMYK

convierta de Sherwin Williams®-número (SW 0000) a CMYK cian / magenta / amarillo / negro

Sherwin Williams® a HEX

convierta de Sherwin Williams®-número (SW 0000) a #RRGGBB

Sherwin Williams® a RAL®

convierta de Sherwin Williams®-número (SW 0000) a RAL®-número (RAL 0000)

Sherwin Williams® a HKS®

convierta de Sherwin Williams®-número (SW 0000) a HKS®-número (HKS 00)

Sherwin Williams® a PANTONE®

convierta de Sherwin Williams®-número (SW 0000) a Pantone®-número (Pantone 0000)

Sherwin Williams® a NCS®

convierta de Sherwin Williams®-número (SW 0000) a NCS-número (S0000-X00X)

NCS® a RGB

convierta de NCS-número (S0000-X00X) a RGB rojo verde azul

NCS® a CMYK

convierta de NCS-número (S0000-X00X) a CMYK cian / magenta / amarillo / negro

NCS® a HEX

convierta de NCS-número (S0000-X00X) a #RRGGBB

NCS® a RAL®

convierta de NCS-número (S0000-X00X) a RAL®-número (RAL 0000)

NCS® a HKS®

convierta de NCS-número (S0000-X00X) a HKS®-número (HKS 00)

NCS® a PANTONE®

convierta de NCS-número (S0000-X00X) a Pantone®-número (Pantone 0000)

NCS® a Sherwin Williams®

convierta de NCS-número (S0000-X00X) a Sherwin Williams®-número (SW 0000)

Códigos

Para guardar estas paletas de color, tendrá que iniciar una sesión personal.

Acceda a su cuenta

o

Crear una cuenta

Paleta de colores actual Compartir
¿Debe ser público o privado?
Enlace(s) después de compartir.

Público

Cancelar Compartir

Paleta de colores compartida
Por favor, copie y guarde el enlace deseado.

Compartir

Ver

OK, he copiado los enlaces

Tus colores se guardarán en una nueva paleta de colores.
Consúltala en tu perfil.
Puedes personalizarla aún más y compartirla.

Mostrar paleta de colores

Crea una paleta de colores

DescargarDescargar en varios formatos

Haciendo clic en puede crear paletas y descargar las muestras de color.