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: #B0E0E6 > #FFFFFF [20] für Ihre Lesezeichen.

# Farbe HEX Name RGBNegativ
1 #B0E0E6Powderblue176, 224, 230#4F1F19
2 #B4E2E7180, 226, 231#4B1D18
3 #B8E3E9184, 227, 233#471C16
4 #BCE5EA188, 229, 234#431A15
5 #C0E6EB192, 230, 235#3F1914
6 #C4E8EC196, 232, 236#3B1713
7 #C8E9EE200, 233, 238#371611
8 #CCEBEF204, 235, 239#331410
9 #D0ECF0208, 236, 240#2F130F
10 #D4EEF1212, 238, 241#2B110E
11 #D8F0F3216, 240, 243#270F0C
12 #DBF1F4219, 241, 244#240E0B
13 #DFF3F5223, 243, 245#200C0A
14 #E3F4F6227, 244, 246#1C0B09
15 #E7F6F8231, 246, 248#180907
16 #EBF7F9235, 247, 249#140806
17 #EFF9FA239, 249, 250#100605
18 #F3FAFB243, 250, 251#0C0504
19 #F7FCFD247, 252, 253#080302
20 #FBFDFE251, 253, 254#040201
21 #FFFFFFWhite255, 255, 255#000000
            Quelltext
color: #B0E0E6;
background-color: #B0E0E6;
<span style="color: #B0E0E6;"></span>
<span style="background-color: #B0E0E6;"></span>

Negativfarben

Farben / Negativfarben Kombination (Beispiele)

    #B0E0E6 =     #4F1F19  Negativfarbe  Negativfarbe

    #FFFFFF =     #000000  Negativfarbe  Negativfarbe

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

Kontrastfarbe

Kontrastfarbe Schwarz oder Weiß:  #000000#000000

Hellere Schriftfarbe: #B0E0E6    -  #B0E0E6 

Dunklere Schriftfarbe: #B0E0E6    -  #B0E0E6 

CSS-Farbverlauf

background: linear-gradient(#B0E0E6, #FFFFFF);
background: linear-gradient(45deg, #B0E0E6, #FFFFFF);
background: linear-gradient(to right, #B0E0E6, #FFFFFF);
background: linear-gradient(to left, #B0E0E6, #FFFFFF);

Viele weitere Farbverläufe finden Sie unter: Farbverlauf mit CSS

PHP - Farbverlauf (Array)

$farbverlauf = [
 "#B0E0E6", "#B4E2E7", "#B8E3E9", "#BCE5EA", "#C0E6EB", "#C4E8EC", "#C8E9EE", "#CCEBEF", "#D0ECF0", "#D4EEF1",
 "#D8F0F3", "#DBF1F4", "#DFF3F5", "#E3F4F6", "#E7F6F8", "#EBF7F9", "#EFF9FA", "#F3FAFB", "#F7FCFD", "#FBFDFE",
 "#FFFFFF"];

JavaScript - Farbverlauf (Array)

var farbverlauf = [
 "#B0E0E6", "#B4E2E7", "#B8E3E9", "#BCE5EA", "#C0E6EB", "#C4E8EC", "#C8E9EE", "#CCEBEF", "#D0ECF0", "#D4EEF1",
 "#D8F0F3", "#DBF1F4", "#DFF3F5", "#E3F4F6", "#E7F6F8", "#EBF7F9", "#EFF9FA", "#F3FAFB", "#F7FCFD", "#FBFDFE",
 "#FFFFFF"];

Tipps

Farbnamen, Hexadezimal, Dezimal, Prozent und Negativ

Farbverlauf mit CSS

Transparenter Farbverlauf

Glühende Neon Buchstaben - Generator

Mit dem Ultimate CSS Gradient Generator von ColorZilla können Sie einen Farbverlauf erstellen.