Farbverlauf Generator

Für das Design einer Webseite ist die Farbwahl ausschlaggebend. Abhängig vom Thema der Homepage oder vom Logo verwenden Sie Farben am besten in Farbabstufungen. Dieser Generator erstellt einen Farbverlauf mit den von Ihnen eingegebenen Farbwerten.

Link zum erstellten Farbverlauf: #FF0000 > #FFD700 [20] für Ihre Lesezeichen.

# Farbe HEX Name RGBNegativ
1                   #FF0000Red255, 0, 0#00FFFF
2                   #FF0B00255, 11, 0#00F4FF
3                   #FF1600255, 22, 0#00E9FF
4                   #FF2000255, 32, 0#00DFFF
5                   #FF2B00255, 43, 0#00D4FF
6                   #FF3600255, 54, 0#00C9FF
7                   #FF4100255, 65, 0#00BEFF
8                   #FF4B00255, 75, 0#00B4FF
9                   #FF5600255, 86, 0#00A9FF
10                   #FF6100255, 97, 0#009EFF
11                   #FF6C00255, 108, 0#0093FF
12                   #FF7600255, 118, 0#0089FF
13                   #FF8100255, 129, 0#007EFF
14                   #FF8C00Darkorange255, 140, 0#0073FF
15                   #FF9700255, 151, 0#0068FF
16                   #FFA100255, 161, 0#005EFF
17                   #FFAC00255, 172, 0#0053FF
18                   #FFB700255, 183, 0#0048FF
19                   #FFC200255, 194, 0#003DFF
20                   #FFCC00255, 204, 0#0033FF
21                   #FFD700Gold255, 215, 0#0028FF
            Quelltext
color: #FF0000;
background-color: #FF0000;
<span style="color: #FF0000;"></span>
<span style="background-color: #FF0000;"></span>

Negativfarben

Farben / Negativfarben Kombination (Beispiele)

    #FF0000 =     #00FFFF  Negativfarbe  Negativfarbe

    #FFD700 =     #0028FF  Negativfarbe  Negativfarbe

In der Farbenlehre sind Negativfarben zwei entgegengesetzte Farben (Komplementärfarben).

Kontrastfarbe

Kontrastfarbe Schwarz oder Weiß:  #FFFFFF#000000

Hellere Schriftfarbe: #FF0000    -  #FF0000 

Dunklere Schriftfarbe: #FF0000    -  #FF0000 

CSS-Farbverlauf

background: linear-gradient(#FF0000, #FFD700);
background: linear-gradient(45deg, #FF0000, #FFD700);
background: linear-gradient(to right, #FF0000, #FFD700);
background: linear-gradient(to left, #FF0000, #FFD700);

PHP / JavaScript - Farbverlauf (Array)

Um es für JavaScript zu verwenden, muss die Variable: $farbverlauf durch var farbverlauf ersetzt werden.

$farbverlauf = [
 "#FF0000", "#FF0B00", "#FF1600", "#FF2000", "#FF2B00", "#FF3600", "#FF4100", "#FF4B00", "#FF5600", "#FF6100",
 "#FF6C00", "#FF7600", "#FF8100", "#FF8C00", "#FF9700", "#FFA100", "#FFAC00", "#FFB700", "#FFC200", "#FFCC00",
 "#FFD700"];

Tipp

Farbnamen, Hexadezimal, Dezimal, Prozent und Negativ