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

✕

CSS Gradienten:
#079678

Information

schließe alle

Lass Dir CSS Farbverläufe aus zwei Farbtönen wie dem Grundfarbton und der Komplementärfarbe vorschlagen.

Finde Beispiele für Lineare und Radiale Farbübergänge.

Einfach für Webdesign: Kopiere Dir den CSS-Code zum einfachen integrieren auf Deiner Webseite.

Lass Dir CSS Farbverläufe aus zwei Farbtönen wie dem Grundfarbton und einem helleren Farbton vorschlagen.

Finde Beispiele für Lineare und Radiale Farbübergänge von Hellere Farbtöne.

Einfach für Webdesign: Kopiere Dir den CSS-Code zum einfachen integrieren auf Deiner Webseite.

Lass Dir CSS Farbverläufe aus zwei Farbtönen wie dem Grundfarbton und einem dunkleren Farbton vorschlagen.

Finde Beispiele für Lineare und Radiale Farbübergänge von Dunklere Farbtöne.

Einfach für Webdesign: Kopiere Dir den CSS-Code zum einfachen integrieren auf Deiner Webseite.

Anzeigeoptionen

Beschreibung

Bei dieser Farbe hebt sich Cyan von den anderen Farben ab. Die Werte die für den blauen und grünen Farbton stehen, sind größer als der dritte Wert. Sie liegen nahe beieinander und übertreffen den Wert des roten Farbtons. Da die Farbwerte im Vergleich zu anderen relativ gering sind, erscheint uns dieser Farbton dunkler.

Die Aufschlüsselung der Farbe in das RGB-Farbsystem: In diesem Farbton sind von 255 maximalen Farbanteilen jeweils 7 Rot, 150 Grün und 120 Blau.

Aus dem Mischverhältnis dieser Farben ergibt sich der angezeigte Farbton in der Mitte der Überschneidungen.

In der Darstellung siehst du, wie die Farbe aus den drei Bestandteilen Rot (oben), Grün (rechts unten) und Blau (links unten) zusammengestellt wird. Mittig ist die Ergebnissfarbe zu sehen.
7 150 120 R G B
Im CMYK-Farbsystem wird die Farbe folgendermaßen zusammengesetzt: In diesem Farbton sind von 100 maximalen Farbanteilen jeweils 95 Cyan, keine Magenta, 20 Gelb und 41 Schwarz.

Aus dem Mischverhältnis dieser Farben ergibt sich der angezeigte Farbton in der Mitte der Überschneidungen.

In der Darstellung siehst du, wie die Farbe aus den vier Bestandteilen Cyan (links oben), Magenta (rechts oben), Gelb oder Yellow (rechts unten) und Schwarz oder Key (links unten) zusammengestellt wird. Mittig ist die Ergebnissfarbe zu sehen.
95% 0% 20% 41% C M Y K

Verifizierung ihrer Farbpalette als Hersteller!

Bieten Sie Designern und Agenturen präzise Farbwerte.

Los geht's

Linear

HEX #079678 zu HEX #F86987


CSS-Code:

background-image: linear-gradient(135deg, #079678 11%, #F86987 94%);

Radial

HEX #079678 zu HEX #F86987


CSS-Code:

background-image: radial-gradient(circle, #079678 3%, #F86987 98%);

 

HEX #F86987 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #F86987 9%, #079678 90%);

 

HEX #F86987 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #F86987 11%, #079678 87%);

Linear

HEX #079678 zu HEX #079651


CSS-Code:

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

Radial

HEX #079678 zu HEX #079651


CSS-Code:

background-image: radial-gradient(circle, #079678 9%, #079651 96%);

 

HEX #079651 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #079651 3%, #079678 95%);

 

HEX #079651 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #079651 5%, #079678 93%);

 

HEX #079678 zu HEX #079677


CSS-Code:

background-image: linear-gradient(135deg, #079678 0%, #079677 99%);

 

HEX #079678 zu HEX #079677


CSS-Code:

background-image: radial-gradient(circle, #079678 3%, #079677 91%);

 

HEX #079677 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #079677 2%, #079678 100%);

 

HEX #079677 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #079677 0%, #079678 91%);

 

HEX #079678 zu HEX #078F96


CSS-Code:

background-image: linear-gradient(135deg, #079678 14%, #078F96 87%);

 

HEX #079678 zu HEX #078F96


CSS-Code:

background-image: radial-gradient(circle, #079678 8%, #078F96 96%);

 

HEX #078F96 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #078F96 2%, #079678 95%);

 

HEX #078F96 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #078F96 13%, #079678 100%);

 

HEX #079678 zu HEX #076996


CSS-Code:

background-image: linear-gradient(135deg, #079678 9%, #076996 91%);

 

HEX #079678 zu HEX #076996


CSS-Code:

background-image: radial-gradient(circle, #079678 5%, #076996 96%);

 

HEX #076996 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #076996 11%, #079678 99%);

 

HEX #076996 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #076996 3%, #079678 87%);

Linear

HEX #079678 zu HEX #056F59


CSS-Code:

background-image: linear-gradient(135deg, #079678 2%, #056F59 87%);

Radial

HEX #079678 zu HEX #056F59


CSS-Code:

background-image: radial-gradient(circle, #079678 7%, #056F59 97%);

 

HEX #056F59 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #056F59 5%, #079678 97%);

 

HEX #056F59 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #056F59 4%, #079678 86%);

 

HEX #079678 zu HEX #08BE98


CSS-Code:

background-image: linear-gradient(135deg, #079678 14%, #08BE98 97%);

 

HEX #079678 zu HEX #08BE98


CSS-Code:

background-image: radial-gradient(circle, #079678 6%, #08BE98 93%);

 

HEX #08BE98 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #08BE98 14%, #079678 88%);

 

HEX #08BE98 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #08BE98 13%, #079678 92%);

 

HEX #079678 zu HEX #0AE5B7


CSS-Code:

background-image: linear-gradient(135deg, #079678 12%, #0AE5B7 99%);

 

HEX #079678 zu HEX #0AE5B7


CSS-Code:

background-image: radial-gradient(circle, #079678 10%, #0AE5B7 100%);

 

HEX #0AE5B7 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #0AE5B7 1%, #079678 97%);

 

HEX #0AE5B7 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #0AE5B7 10%, #079678 94%);

Linear

HEX #079678 zu HEX #079651


CSS-Code:

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

Radial

HEX #079678 zu HEX #079651


CSS-Code:

background-image: radial-gradient(circle, #079678 9%, #079651 98%);

 

HEX #079651 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #079651 12%, #079678 94%);

 

HEX #079651 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #079651 5%, #079678 95%);

 

HEX #079678 zu HEX #079677


CSS-Code:

background-image: linear-gradient(135deg, #079678 1%, #079677 94%);

 

HEX #079678 zu HEX #079677


CSS-Code:

background-image: radial-gradient(circle, #079678 5%, #079677 86%);

 

HEX #079677 zu HEX #079678


CSS-Code:

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

 

HEX #079677 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #079677 9%, #079678 87%);

 

HEX #079678 zu HEX #078F96


CSS-Code:

background-image: linear-gradient(135deg, #079678 8%, #078F96 86%);

 

HEX #079678 zu HEX #078F96


CSS-Code:

background-image: radial-gradient(circle, #079678 2%, #078F96 95%);

 

HEX #078F96 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #078F96 9%, #079678 90%);

 

HEX #078F96 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #078F96 12%, #079678 89%);

 

HEX #079678 zu HEX #076996


CSS-Code:

background-image: linear-gradient(135deg, #079678 9%, #076996 97%);

 

HEX #079678 zu HEX #076996


CSS-Code:

background-image: radial-gradient(circle, #079678 9%, #076996 86%);

 

HEX #076996 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #076996 12%, #079678 100%);

 

HEX #076996 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #076996 2%, #079678 100%);

Linear

HEX #079678 zu HEX #056F59


CSS-Code:

background-image: linear-gradient(135deg, #079678 9%, #056F59 87%);

Radial

HEX #079678 zu HEX #056F59


CSS-Code:

background-image: radial-gradient(circle, #079678 3%, #056F59 92%);

 

HEX #056F59 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #056F59 11%, #079678 89%);

 

HEX #056F59 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #056F59 2%, #079678 87%);

 

HEX #079678 zu HEX #08BE98


CSS-Code:

background-image: linear-gradient(135deg, #079678 0%, #08BE98 95%);

 

HEX #079678 zu HEX #08BE98


CSS-Code:

background-image: radial-gradient(circle, #079678 2%, #08BE98 86%);

 

HEX #08BE98 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #08BE98 11%, #079678 96%);

 

HEX #08BE98 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #08BE98 10%, #079678 99%);

 

HEX #079678 zu HEX #0AE5B7


CSS-Code:

background-image: linear-gradient(135deg, #079678 8%, #0AE5B7 86%);

 

HEX #079678 zu HEX #0AE5B7


CSS-Code:

background-image: radial-gradient(circle, #079678 12%, #0AE5B7 96%);

 

HEX #0AE5B7 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #0AE5B7 1%, #079678 100%);

 

HEX #0AE5B7 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #0AE5B7 11%, #079678 96%);

Linear

HEX #079678 zu HEX #070996


CSS-Code:

background-image: linear-gradient(135deg, #079678 0%, #070996 90%);

Radial

HEX #079678 zu HEX #070996


CSS-Code:

background-image: radial-gradient(circle, #079678 13%, #070996 93%);

 

HEX #070996 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #070996 9%, #079678 100%);

 

HEX #070996 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #070996 2%, #079678 87%);

 

HEX #079678 zu HEX #963E07


CSS-Code:

background-image: linear-gradient(135deg, #079678 5%, #963E07 97%);

 

HEX #079678 zu HEX #963E07


CSS-Code:

background-image: radial-gradient(circle, #079678 11%, #963E07 99%);

 

HEX #963E07 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #963E07 0%, #079678 92%);

 

HEX #963E07 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #963E07 13%, #079678 87%);

Linear

HEX #079678 zu HEX #770796


CSS-Code:

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

Radial

HEX #079678 zu HEX #770796


CSS-Code:

background-image: radial-gradient(circle, #079678 12%, #770796 89%);

 

HEX #770796 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #770796 5%, #079678 87%);

 

HEX #770796 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #770796 14%, #079678 92%);

 

HEX #079678 zu HEX #967707


CSS-Code:

background-image: linear-gradient(135deg, #079678 14%, #967707 96%);

 

HEX #079678 zu HEX #967707


CSS-Code:

background-image: radial-gradient(circle, #079678 11%, #967707 93%);

 

HEX #967707 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #967707 8%, #079678 89%);

 

HEX #967707 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #967707 11%, #079678 99%);

Linear

HEX #079678 zu HEX #070996


CSS-Code:

background-image: linear-gradient(135deg, #079678 5%, #070996 96%);

Radial

HEX #079678 zu HEX #070996


CSS-Code:

background-image: radial-gradient(circle, #079678 5%, #070996 91%);

 

HEX #070996 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #070996 7%, #079678 94%);

 

HEX #070996 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #070996 10%, #079678 97%);

 

HEX #079678 zu HEX #960726


CSS-Code:

background-image: linear-gradient(135deg, #079678 0%, #960726 91%);

 

HEX #079678 zu HEX #960726


CSS-Code:

background-image: radial-gradient(circle, #079678 13%, #960726 97%);

 

HEX #960726 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #960726 13%, #079678 90%);

 

HEX #960726 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #960726 12%, #079678 94%);

 

HEX #079678 zu HEX #969407


CSS-Code:

background-image: linear-gradient(135deg, #079678 6%, #969407 94%);

 

HEX #079678 zu HEX #969407


CSS-Code:

background-image: radial-gradient(circle, #079678 7%, #969407 99%);

 

HEX #969407 zu HEX #079678


CSS-Code:

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

 

HEX #969407 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #969407 12%, #079678 97%);

Linear

HEX #079678 zu HEX #2F0796


CSS-Code:

background-image: linear-gradient(135deg, #079678 6%, #2F0796 98%);

Radial

HEX #079678 zu HEX #2F0796


CSS-Code:

background-image: radial-gradient(circle, #079678 11%, #2F0796 90%);

 

HEX #2F0796 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #2F0796 7%, #079678 91%);

 

HEX #2F0796 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #2F0796 9%, #079678 86%);

 

HEX #079678 zu HEX #960726


CSS-Code:

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

 

HEX #079678 zu HEX #960726


CSS-Code:

background-image: radial-gradient(circle, #079678 9%, #960726 86%);

 

HEX #960726 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #960726 1%, #079678 88%);

 

HEX #960726 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #960726 5%, #079678 97%);

 

HEX #079678 zu HEX #6E9607


CSS-Code:

background-image: linear-gradient(135deg, #079678 8%, #6E9607 87%);

 

HEX #079678 zu HEX #6E9607


CSS-Code:

background-image: radial-gradient(circle, #079678 7%, #6E9607 94%);

 

HEX #6E9607 zu HEX #079678


CSS-Code:

background-image: linear-gradient(135deg, #6E9607 14%, #079678 98%);

 

HEX #6E9607 zu HEX #079678


CSS-Code:

background-image: radial-gradient(circle, #6E9607 11%, #079678 94%);

Zeige mehr Farbpaletten

Services

Farben

RGB in HEX

umrechnen von RGB rot grün blau zu #RRGGBB

RGB in CMYK

umrechnen von RGB rot grün blau zu CMYK cyan / magenta / gelb / key

Icons

RGB in RAL®

umrechnen von RGB rot grün blau zu RAL®-Nummer (RAL 0000)

RGB in HKS®

umrechnen von RGB rot grün blau zu HKS®-Nummer (HKS 00)

RGB in PANTONE®

umrechnen von RGB rot grün blau zu Pantone®-Nummer (Pantone 0000)

RGB in Sherwin Williams®

umrechnen von RGB rot grün blau zu Sherwin Williams®-Nummer (SW 0000)

RGB in NCS®

umrechnen von RGB rot grün blau zu NCS-Nummer (S0000-X00X)

nsc-logo
Icons

CMYK in HEX

umrechnen von CMYK cyan / magenta / gelb / key zu #RRGGBB
Icons

CMYK in RGB

umrechnen von CMYK cyan / magenta / gelb / key zu RGB rot grün blau
Icons

CMYK in RAL®

umrechnen von CMYK cyan / magenta / gelb / key zu RAL®-Nummer (RAL 0000)
Icons

CMYK in HKS®

umrechnen von CMYK cyan / magenta / gelb / key zu HKS®-Nummer (HKS 00)
Icons

CMYK in PANTONE®

umrechnen von CMYK cyan / magenta / gelb / key zu Pantone®-Nummer (Pantone 0000)
Icons

CMYK in Sherwin Williams®

umrechnen von CMYK cyan / magenta / gelb / key zu Sherwin Williams®-Nummer (SW 0000)
Icons

CMYK in NCS®

umrechnen von CMYK cyan / magenta / gelb / key zu NCS-Nummer (S0000-X00X)

nsc-logo

HEX in RGB

umrechnen von #RRGGBB zu RGB rot grün blau

HEX in CMYK

umrechnen von #RRGGBB zu CMYK cyan / magenta / gelb / key

Icons

HEX in RAL®

umrechnen von #RRGGBB zu RAL®-Nummer (RAL 0000)

HEX in HKS®

umrechnen von #RRGGBB zu HKS®-Nummer (HKS 00)

HEX in PANTONE®

umrechnen von #RRGGBB zu Pantone®-Nummer (Pantone 0000)

HEX in Sherwin Williams®

umrechnen von #RRGGBB zu Sherwin Williams®-Nummer (SW 0000)

HEX in NCS®

umrechnen von #RRGGBB zu NCS-Nummer (S0000-X00X)

nsc-logo

RAL® in RGB

umrechnen von RAL®-Nummer (RAL 0000) zu RGB rot grün blau

RAL® in CMYK

umrechnen von RAL®-Nummer (RAL 0000) zu CMYK cyan / magenta / gelb / key

Icons

RAL® in HEX

umrechnen von RAL®-Nummer (RAL 0000) zu #RRGGBB

RAL® in HKS®

umrechnen von RAL®-Nummer (RAL 0000) zu HKS®-Nummer (HKS 00)

RAL® in PANTONE®

umrechnen von RAL®-Nummer (RAL 0000) zu Pantone®-Nummer (Pantone 0000)

RAL® in Sherwin Williams®

umrechnen von RAL®-Nummer (RAL 0000) zu Sherwin Williams®-Nummer (SW 0000)

RAL® in NCS®

umrechnen von RAL®-Nummer (RAL 0000) zu NCS-Nummer (S0000-X00X)

nsc-logo

HKS® in RGB

umrechnen von HKS®-Nummer (HKS 00) zu RGB rot grün blau

HKS® in CMYK

umrechnen von HKS®-Nummer (HKS 00) zu CMYK cyan / magenta / gelb / key

Icons

HKS® in HEX

umrechnen von HKS®-Nummer (HKS 00) zu #RRGGBB

HKS® in RAL®

umrechnen von HKS®-Nummer (HKS 00) zu RAL®-Nummer (RAL 0000)

HKS® in PANTONE®

umrechnen von HKS®-Nummer (HKS 00) zu Pantone®-Nummer (Pantone 0000)

HKS® in Sherwin Williams®

umrechnen von HKS®-Nummer (HKS 00) zu Sherwin Williams®-Nummer (SW 0000)

HKS® in NCS®

umrechnen von HKS®-Nummer (HKS 00) zu NCS-Nummer (S0000-X00X)

nsc-logo

PANTONE® in RGB

umrechnen von Pantone®-Nummer (Pantone 0000) zu RGB rot grün blau

PANTONE® in CMYK

umrechnen von Pantone®-Nummer (Pantone 0000) zu CMYK cyan / magenta / gelb / key

Icons

PANTONE® in HEX

umrechnen von Pantone®-Nummer (Pantone 0000) zu #RRGGBB

PANTONE® in RAL®

umrechnen von Pantone®-Nummer (Pantone 0000) zu RAL®-Nummer (RAL 0000)

PANTONE® in HKS®

umrechnen von Pantone®-Nummer (Pantone 0000) zu HKS®-Nummer (HKS 00)

PANTONE® in Sherwin Williams®

umrechnen von Pantone®-Nummer (Pantone 0000) zu Sherwin Williams®-Nummer (SW 0000)

PANTONE® in NCS®

umrechnen von Pantone®-Nummer (Pantone 0000) zu NCS-Nummer (S0000-X00X)

nsc-logo

Sherwin Williams® in RGB

umrechnen von Sherwin Williams®-Nummer (SW 0000) zu RGB rot grün blau

Sherwin Williams® in CMYK

umrechnen von Sherwin Williams®-Nummer (SW 0000) zu CMYK cyan / magenta / gelb / key

Icons

Sherwin Williams® in HEX

umrechnen von Sherwin Williams®-Nummer (SW 0000) zu #RRGGBB

Sherwin Williams® in RAL®

umrechnen von Sherwin Williams®-Nummer (SW 0000) zu RAL®-Nummer (RAL 0000)

Sherwin Williams® in HKS®

umrechnen von Sherwin Williams®-Nummer (SW 0000) zu HKS®-Nummer (HKS 00)

Sherwin Williams® in PANTONE®

umrechnen von Sherwin Williams®-Nummer (SW 0000) zu Pantone®-Nummer (Pantone 0000)

Sherwin Williams® in NCS®

umrechnen von Sherwin Williams®-Nummer (SW 0000) zu NCS-Nummer (S0000-X00X)

nsc-logo
nsc-logo

NCS® in RGB

umrechnen von NCS-Nummer (S0000-X00X) zu RGB rot grün blau
nsc-logo

NCS® in CMYK

umrechnen von NCS-Nummer (S0000-X00X) zu CMYK cyan / magenta / gelb / key

Icons
nsc-logo

NCS® in HEX

umrechnen von NCS-Nummer (S0000-X00X) zu #RRGGBB
nsc-logo

NCS® in RAL®

umrechnen von NCS-Nummer (S0000-X00X) zu RAL®-Nummer (RAL 0000)
nsc-logo

NCS® in HKS®

umrechnen von NCS-Nummer (S0000-X00X) zu HKS®-Nummer (HKS 00)
nsc-logo

NCS® in PANTONE®

umrechnen von NCS-Nummer (S0000-X00X) zu Pantone®-Nummer (Pantone 0000)
nsc-logo

NCS® in Sherwin Williams®

umrechnen von NCS-Nummer (S0000-X00X) zu Sherwin Williams®-Nummer (SW 0000)

Codes

To be able to save color palettes, you must be logged in.

Sign in to your account

or

Create an account

Current color palette Share
Should it be public or private?
Link(s) will follow after sharing.

Cancel Share

Color palette shared
Please copy and save the link you want.

Share

OK, I have copied the links

Your colors will be saved in a new color palette.
View it under your profile.
You can further customize it, and share it.

Show color palette
Close

Create a color palette

DownloadDownload in different formats

Remove All

By clicking you can create palettes and download the color swatches.

© 2019-2025 in cooperation ND-DESIGN.WORKS & frag-bobby.de