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

✕

CSS Gradientes:
#4BFAA3

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

Con este color el ciano sobresale más que los otros colores. El valor que los tonos azul y verde respresentan es más grande que el tercer valor. Estan más cercanos y superan el valor del tono rojo Como el valor de los colores es relativamente alto comparado con otros, este tono parece ser más claro.

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 75 el rojo, 250 el verde y 163 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 70 ciano, ninguno magenta, 35 amarillo y 2 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 #4BFAA3 - Color complementario

Lineal

HEX #4BFAA3 a HEX #B4055C

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 2%, #B4055C 88%);

Radial

HEX #4BFAA3 a HEX #B4055C

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 14%, #B4055C 99%);

HEX #B4055C a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #B4055C 10%, #4BFAA3 98%);

HEX #B4055C a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #B4055C 14%, #4BFAA3 86%);

Gradientes de 2 colores de #4BFAA3 - Colores más claros

Lineal

HEX #4BFAA3 a HEX #4BFA74

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 0%, #4BFA74 96%);

Radial

HEX #4BFAA3 a HEX #4BFA74

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 2%, #4BFA74 96%);

HEX #4BFA74 a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #4BFA74 7%, #4BFAA3 98%);

HEX #4BFA74 a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #4BFA74 0%, #4BFAA3 86%);

HEX #4BFAA3 a HEX #4BFAD1

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 8%, #4BFAD1 95%);

HEX #4BFAA3 a HEX #4BFAD1

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 9%, #4BFAD1 87%);

HEX #4BFAD1 a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #4BFAD1 11%, #4BFAA3 99%);

HEX #4BFAD1 a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #4BFAD1 11%, #4BFAA3 100%);

HEX #4BFAA3 a HEX #4BF4FA

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 13%, #4BF4FA 98%);

HEX #4BFAA3 a HEX #4BF4FA

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 1%, #4BF4FA 87%);

HEX #4BF4FA a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #4BF4FA 7%, #4BFAA3 98%);

HEX #4BF4FA a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #4BF4FA 6%, #4BFAA3 97%);

Gradientes de 2 colores de #4BFAA3 - Colores más oscuros

Lineal

HEX #4BFAA3 a HEX #23F98F

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 9%, #23F98F 91%);

Radial

HEX #4BFAA3 a HEX #23F98F

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 9%, #23F98F 98%);

HEX #23F98F a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #23F98F 1%, #4BFAA3 98%);

HEX #23F98F a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #23F98F 4%, #4BFAA3 100%);

HEX #4BFAA3 a HEX #74FBB8

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 2%, #74FBB8 86%);

HEX #4BFAA3 a HEX #74FBB8

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 8%, #74FBB8 100%);

HEX #74FBB8 a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #74FBB8 14%, #4BFAA3 91%);

HEX #74FBB8 a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #74FBB8 7%, #4BFAA3 86%);

HEX #4BFAA3 a HEX #9CFCCC

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 0%, #9CFCCC 89%);

HEX #4BFAA3 a HEX #9CFCCC

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 5%, #9CFCCC 96%);

HEX #9CFCCC a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #9CFCCC 7%, #4BFAA3 100%);

HEX #9CFCCC a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #9CFCCC 11%, #4BFAA3 92%);

Gradientes de 2 colores de #4BFAA3 - Colores análogos

Lineal

HEX #4BFAA3 a HEX #4BFA74

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 12%, #4BFA74 98%);

Radial

HEX #4BFAA3 a HEX #4BFA74

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 6%, #4BFA74 90%);

HEX #4BFA74 a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #4BFA74 11%, #4BFAA3 98%);

HEX #4BFA74 a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #4BFA74 8%, #4BFAA3 94%);

HEX #4BFAA3 a HEX #4BFAD1

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 9%, #4BFAD1 90%);

HEX #4BFAA3 a HEX #4BFAD1

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 7%, #4BFAD1 97%);

HEX #4BFAD1 a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #4BFAD1 10%, #4BFAA3 96%);

HEX #4BFAD1 a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #4BFAD1 4%, #4BFAA3 99%);

HEX #4BFAA3 a HEX #4BF4FA

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 8%, #4BF4FA 88%);

HEX #4BFAA3 a HEX #4BF4FA

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 4%, #4BF4FA 94%);

HEX #4BF4FA a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #4BF4FA 3%, #4BFAA3 90%);

HEX #4BF4FA a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #4BF4FA 10%, #4BFAA3 94%);

Gradientes de 2 colores de #4BFAA3 - Colores monocromáticos

Lineal

HEX #4BFAA3 a HEX #23F98F

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 1%, #23F98F 92%);

Radial

HEX #4BFAA3 a HEX #23F98F

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 3%, #23F98F 92%);

HEX #23F98F a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #23F98F 8%, #4BFAA3 95%);

HEX #23F98F a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #23F98F 12%, #4BFAA3 99%);

HEX #4BFAA3 a HEX #74FBB8

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 4%, #74FBB8 94%);

HEX #4BFAA3 a HEX #74FBB8

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 2%, #74FBB8 93%);

HEX #74FBB8 a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #74FBB8 12%, #4BFAA3 89%);

HEX #74FBB8 a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #74FBB8 4%, #4BFAA3 99%);

HEX #4BFAA3 a HEX #9CFCCC

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 9%, #9CFCCC 91%);

HEX #4BFAA3 a HEX #9CFCCC

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 4%, #9CFCCC 97%);

HEX #9CFCCC a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #9CFCCC 2%, #4BFAA3 91%);

HEX #9CFCCC a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #9CFCCC 13%, #4BFAA3 96%);

Gradientes de 2 colores de #4BFAA3 - Colores parcialmente complementarios

Lineal

HEX #4BFAA3 a HEX #4B80FA

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 1%, #4B80FA 89%);

Radial

HEX #4BFAA3 a HEX #4B80FA

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 6%, #4B80FA 96%);

HEX #4B80FA a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #4B80FA 9%, #4BFAA3 90%);

HEX #4B80FA a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #4B80FA 0%, #4BFAA3 90%);

HEX #4BFAA3 a HEX #FA5D4B

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 3%, #FA5D4B 93%);

HEX #4BFAA3 a HEX #FA5D4B

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 5%, #FA5D4B 86%);

HEX #FA5D4B a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #FA5D4B 4%, #4BFAA3 92%);

HEX #FA5D4B a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #FA5D4B 0%, #4BFAA3 87%);

Gradientes de 2 colores de #4BFAA3 - Colores triádicos

Lineal

HEX #4BFAA3 a HEX #A34BFA

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 7%, #A34BFA 86%);

Radial

HEX #4BFAA3 a HEX #A34BFA

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 8%, #A34BFA 97%);

HEX #A34BFA a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #A34BFA 14%, #4BFAA3 94%);

HEX #A34BFA a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #A34BFA 1%, #4BFAA3 91%);

HEX #4BFAA3 a HEX #FAA34B

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 5%, #FAA34B 96%);

HEX #4BFAA3 a HEX #FAA34B

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 8%, #FAA34B 91%);

HEX #FAA34B a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #FAA34B 8%, #4BFAA3 90%);

HEX #FAA34B a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #FAA34B 2%, #4BFAA3 86%);

Gradientes de 2 colores de #4BFAA3 - Colores rectangulares (tetradicos)

Lineal

HEX #4BFAA3 a HEX #4B80FA

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 10%, #4B80FA 88%);

Radial

HEX #4BFAA3 a HEX #4B80FA

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 0%, #4B80FA 93%);

HEX #4B80FA a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #4B80FA 5%, #4BFAA3 95%);

HEX #4B80FA a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #4B80FA 4%, #4BFAA3 89%);

HEX #4BFAA3 a HEX #FA4BA3

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 6%, #FA4BA3 86%);

HEX #4BFAA3 a HEX #FA4BA3

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 13%, #FA4BA3 95%);

HEX #FA4BA3 a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #FA4BA3 4%, #4BFAA3 92%);

HEX #FA4BA3 a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #FA4BA3 1%, #4BFAA3 94%);

HEX #4BFAA3 a HEX #FAC64B

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 8%, #FAC64B 100%);

HEX #4BFAA3 a HEX #FAC64B

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 11%, #FAC64B 98%);

HEX #FAC64B a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #FAC64B 3%, #4BFAA3 92%);

HEX #FAC64B a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #FAC64B 5%, #4BFAA3 100%);

Gradientes de 2 colores de #4BFAA3 - Colores cuadrados

Lineal

HEX #4BFAA3 a HEX #4B4BFA

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 7%, #4B4BFA 93%);

Radial

HEX #4BFAA3 a HEX #4B4BFA

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 12%, #4B4BFA 87%);

HEX #4B4BFA a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #4B4BFA 6%, #4BFAA3 97%);

HEX #4B4BFA a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #4B4BFA 0%, #4BFAA3 97%);

HEX #4BFAA3 a HEX #FA4BA3

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 11%, #FA4BA3 92%);

HEX #4BFAA3 a HEX #FA4BA3

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 14%, #FA4BA3 90%);

HEX #FA4BA3 a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #FA4BA3 6%, #4BFAA3 100%);

HEX #FA4BA3 a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #FA4BA3 10%, #4BFAA3 95%);

HEX #4BFAA3 a HEX #FAFA4B

Código CSS:

background-image: linear-gradient(135deg, #4BFAA3 7%, #FAFA4B 90%);

HEX #4BFAA3 a HEX #FAFA4B

Código CSS:

background-image: radial-gradient(circle, #4BFAA3 14%, #FAFA4B 95%);

HEX #FAFA4B a HEX #4BFAA3

Código CSS:

background-image: linear-gradient(135deg, #FAFA4B 5%, #4BFAA3 86%);

HEX #FAFA4B a HEX #4BFAA3

Código CSS:

background-image: radial-gradient(circle, #FAFA4B 0%, #4BFAA3 99%);

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.