Alles rund um die Farbe

Gib hier einfach die Farbe ein und los geht's:

Farbe
Gib die Farbe an, welche ausgewertet werden soll, z.B. "#ff8000", "rgb 255,128,0", "hsl 260,0.5,0.5", "hsl 200,50%,50%", "hsv 300,0.4,0.5", "cmyk 20%,20%,10%,0%", ...

Farbeninformation

Hier eine Liste mit Informationen rund um die gewählte Farbe. Das Lupensymbol kann verwendet werden um diese Farbe in einer anderen Kodierung zu suchen. Das ist ganz hilfreich wenn man die RGB Farbe kennt aber die Helligkeit verändern möchte.

#dd4b39
rgb(221, 75, 57)

hex : #dd4b39
rgb : rgb(221, 75, 57)
hsl : hsl(6.585, 70.7%, 54.5%)
Name : Scarlet
HEX : #DD4B39
RGB : 221, 75, 57
HSL : 6.585, 0.707, 0.545
HSL % : 6.585, 70.7, 54.5
HSV : 6.585, 0.742, 0.867
HSV % : 6.585, 74.2, 86.7
CMY : 0.133, 0.706, 0.776
CMYK % : 0%, 66.1%, 74.2%, 13.3%
XYZ : 33.073, 20.7, 6.123
CIELAB : 52.62, 55.907, 41.686


Komplementärfarbe

Die Komplementärfarbe ist jene Farbe, welche auf der anderen Seite des Farbenkreises zu finden ist.
#39cddd
rgb(57, 205, 221)


Analoges Farbschema

Hier die Farben zu einem analogen Farbschema. In diesem Fall wird ausgehend vom Farbton der Farbe der Farbton jeweils 30° nach rechts und nach links variiert.
#dd397b
rgb(221, 57, 123)
#dd4b39
rgb(221, 75, 57)
#dd9b39
rgb(221, 155, 57)


Analoges Farbschema (nah)

Hier die Farben zu einem analogen Farbschema mit relativ nahen Farben. In diesem Fall wird ausgehend vom Farbton der Farbe der Farbton jeweils 15° nach rechts und nach links variiert.
#dd3952
rgb(221, 57, 82)
#dd4b39
rgb(221, 75, 57)
#dd7239
rgb(221, 114, 57)


Triadisches Farbschema

Dieses Farbschema entsteht indem ausgehend von der gewählten Farbe der Farbton jeweils um 120° nach rechts und links verschoben wird. Damit erhält man drei Farben mit dem maximalen Abstand am Farbkreis.
#dd4b39
rgb(221, 75, 57)
#39dd49
rgb(57, 221, 73)
#4939dd
rgb(73, 57, 221)


Triadisches Farbschema

Dieses Farbschema entsteht indem ausgehend von der gewählten Farbe der Farbton jeweils um 120° nach rechts und links verschoben wird. Damit erhält man drei Farben mit dem maximalen Abstand am Farbkreis.
#dd4b39
rgb(221, 75, 57)
#39dd49
rgb(57, 221, 73)
#4939dd
rgb(73, 57, 221)


Geteilt komplementäres Farbschema

Bei diesem Farbschema werden zwei Farben neben der Komplementärfarbe hinzugenommen. Es wird also die Komplementärfarbe gesucht und dann jeweils ein Farbton rechts und einer links davon gewählt.
#dd4b39
rgb(221, 75, 57)
#39dd9b
rgb(57, 221, 155)
#397bdd
rgb(57, 123, 221)


Rechteckiges Farbschema

Hier werden die Farben als Rechteck im Farbenkreis ausgewählt. Bei der hier verwendeten Implementierung wird für die genau Auswahl der Farben der goldene Winkel verwendet um möglichst gefällige Farben zu finden.
#dd4b39
rgb(221, 75, 57)
#39dd78
rgb(57, 221, 120)
#39cddd
rgb(57, 205, 221)
#dd399e
rgb(221, 57, 158)


Rechteckiges Farbschema links

Dieses Farbschema nutzt das gleiche Prinzip wie das rechteckige Farbschema zuvor, allerdings wird das Rechteck in die andere Richtung im Farbkreis gelegt.
#dd4b39
rgb(221, 75, 57)
#ddbf39
rgb(221, 191, 57)
#39cddd
rgb(57, 205, 221)
#3957dd
rgb(57, 87, 221)


Quadratisches Farbschema

Beim quadratischen Farbschema werden vier Farben gleichmäßig über den Farbkreis verteilt.
#dd4b39
rgb(221, 75, 57)
#7bdd39
rgb(123, 221, 57)
#39cddd
rgb(57, 205, 221)
#9b39dd
rgb(155, 57, 221)


Fünf Farben Farbschema

Dieses Farbschema nutzt 5 Farben welche ausgehend von der gewählten Farbe über den Farbkreis verteilt sind. Das bedeutet, dass der Farbton jeweils um 72° verschoben ist.
#dd4b39
rgb(221, 75, 57)
#acdd39
rgb(172, 221, 57)
#39dd8b
rgb(57, 221, 139)
#396add
rgb(57, 106, 221)
#cd39dd
rgb(205, 57, 221)


Sechs Farben Schema

Dieses Farbschema verteilt 6 Farben gleichmäßig über den Farbenkreis. Das bedeutet, dass der Farbton jeweils 60° vom nächsten Farbton entfernt liegt.
#dd4b39
rgb(221, 75, 57)
#cddd39
rgb(205, 221, 57)
#39dd49
rgb(57, 221, 73)
#39cddd
rgb(57, 205, 221)
#4939dd
rgb(73, 57, 221)
#dd39cd
rgb(221, 57, 205)


Aufhellung

Die Aufhellung der Farbe ergibt sich durch eine Erhöhung der Helligkeit bis hin zu weiß.
#dd4939 | rgb(221, 73, 57)
#e26355 | rgb(226, 99, 85)
#e77d72 | rgb(231, 125, 114)
#ec978e | rgb(236, 151, 142)
#f0b1aa | rgb(240, 177, 170)
#f5cbc6 | rgb(245, 203, 198)
#fae5e3 | rgb(250, 229, 227)
#ffffff | rgb(255, 255, 255)


Schatten und Schattierung

Die Schattenfarben ergeben sich durch eine Reduzierung der Helligkeit der Farbe bis hin zu Schwarz.
#dd4939 | rgb(221, 73, 57)
#cb3423 | rgb(203, 52, 35)
#a92b1d | rgb(169, 43, 29)
#882217 | rgb(136, 34, 23)
#661a11 | rgb(102, 26, 17)
#44110c | rgb(68, 17, 12)
#220906 | rgb(34, 9, 6)
#000000 | rgb(0, 0, 0)


Sättigung der Farbe

Hier wird die Sättigung der Farbe immer stärker reduziert. Wenn die Sättigung der Farbe vollständig verschwunden ist, dann bleibt nur noch ein Grauton übrig.
#dd4939 | rgb(221, 73, 57)
#d15345 | rgb(209, 83, 69)
#c65c50 | rgb(198, 92, 80)
#ba655c | rgb(186, 101, 92)
#ae6f68 | rgb(174, 111, 104)
#a27874 | rgb(162, 120, 116)
#97827f | rgb(151, 130, 127)
#8b8b8b | rgb(139, 139, 139)


Farbe Intensivieren

Bei der gewählten Farbe wird hier bei jedem Schritt die Sättigung verstärkt. Bei maximaler Sättigung ist die Farbe am intensivsten.
#dd4939 | rgb(221, 73, 57)
#e24534 | rgb(226, 69, 52)
#e7422f | rgb(231, 66, 47)
#ec3e2a | rgb(236, 62, 42)
#f03a26 | rgb(240, 58, 38)
#f53621 | rgb(245, 54, 33)
#fa321c | rgb(250, 50, 28)
#ff2e17 | rgb(255, 46, 23)


convert-color-hues

convert-color-hues-explanation
#dd4939 | rgb(221, 73, 57) | hsl(5.854, 0.707,0.545)
#dd8839 | rgb(221, 136, 57) | hsl(28.902, 0.707,0.545)
#ddc439 | rgb(221, 196, 57) | hsl(50.854, 0.707,0.545)
#b7dd39 | rgb(183, 221, 57) | hsl(73.902, 0.707,0.545)
#7bdd39 | rgb(123, 221, 57) | hsl(95.854, 0.707,0.545)
#3cdd39 | rgb(60, 221, 57) | hsl(118.902, 0.707,0.545)
#39dd72 | rgb(57, 221, 114) | hsl(140.854, 0.707,0.545)
#39ddb1 | rgb(57, 221, 177) | hsl(163.902, 0.707,0.545)
#39cddd | rgb(57, 205, 221) | hsl(185.854, 0.707,0.545)
#398edd | rgb(57, 142, 221) | hsl(208.902, 0.707,0.545)
#3952dd | rgb(57, 82, 221) | hsl(230.854, 0.707,0.545)
#5f39dd | rgb(95, 57, 221) | hsl(253.902, 0.707,0.545)
#9b39dd | rgb(155, 57, 221) | hsl(275.854, 0.707,0.545)
#da39dd | rgb(218, 57, 221) | hsl(298.902, 0.707,0.545)
#dd39a4 | rgb(221, 57, 164) | hsl(320.854, 0.707,0.545)
#dd3965 | rgb(221, 57, 101) | hsl(343.902, 0.707,0.545)


Color Table

Showing the color table based on modified HSL values. Values are separated by comma(,).

H (0-360):
S (0-100):
L (0-100):
Select (x-y):

Saturation: 50(-20)
1
2
3
4
5
1
#2b4685
rgb(43, 70, 133)
#7c2b85
rgb(124, 43, 133)
#85342b
rgb(133, 52, 43)
#6a852b
rgb(106, 133, 43)
#2b8558
rgb(43, 133, 88)
2
#5073c6
rgb(80, 115, 198)
#ba50c6
rgb(186, 80, 198)
#c65c50
rgb(198, 92, 80)
#a3c650
rgb(163, 198, 80)
#50c68b
rgb(80, 198, 139)
3
#9db1df
rgb(157, 177, 223)
#d89ddf
rgb(216, 157, 223)
#dfa49d
rgb(223, 164, 157)
#cbdf9d
rgb(203, 223, 157)
#9ddfbe
rgb(157, 223, 190)
Saturation: 70(0)
1
2
3
4
5
4
#1a3f96
rgb(26, 63, 150)
#8a1a96
rgb(138, 26, 150)
#96261a
rgb(150, 38, 26)
#71961a
rgb(113, 150, 26)
#1a9658
rgb(26, 150, 88)
5
#396add
rgb(57, 106, 221)
#cd39dd
rgb(205, 57, 221)
#dd4939
rgb(221, 73, 57)
#acdd39
rgb(172, 221, 57)
#39dd8b
rgb(57, 221, 139)
6
#90acec
rgb(144, 172, 236)
#e390ec
rgb(227, 144, 236)
#ec9990
rgb(236, 153, 144)
#d0ec90
rgb(208, 236, 144)
#90ecbe
rgb(144, 236, 190)
Saturation: 90(+20)
1
2
3
4
5
7
#0838a8
rgb(8, 56, 168)
#9808a8
rgb(152, 8, 168)
#a81808
rgb(168, 24, 8)
#78a808
rgb(120, 168, 8)
#08a858
rgb(8, 168, 88)
8
#2261f4
rgb(34, 97, 244)
#df22f4
rgb(223, 34, 244)
#f43722
rgb(244, 55, 34)
#b5f422
rgb(181, 244, 34)
#22f48b
rgb(34, 244, 139)
9
#83a6f9
rgb(131, 166, 249)
#ed83f9
rgb(237, 131, 249)
#f98f83
rgb(249, 143, 131)
#d6f983
rgb(214, 249, 131)
#83f9be
rgb(131, 249, 190)

Selected Colors

#5073c6
rgb(80, 115, 198)
#c65c50
rgb(198, 92, 80)

Schnelle Farbeninformation und Farbschema

Diese Seite entstand hauptsächlich um schnell und einfach mit Farben arbeiten zu können. Daher kann die Farbe auch direkt in der URL (als im Link) übergeben werden um Ergebnisse zu erhalten.\nHier ein paar Beispiele wie man eine Farbe übergeben kann:\nDirekte Übergabe eines Hex Farbcodes. Bitte ohne das # Zeichen:\nhttps://www.russwurm.at/color/ff8000 \n\nDirekte Übergabe eines RGB Farbcodes:\nhttps://www.russwurm.at/color/rgb(255,128,0)\n\nDirekte Übergabe eines HSL Farbwertes:\nhttps://www.russwurm.at/color/hsl(100,0.3,0.3)\n\nDie HSL Werte können auch als Prozentwerte übergeben werden:\nhttps://www.russwurm.at/color/hsl(100,30,30)

Full URL:
https://www.russwurm.at/color/dd4b39//?hues=&sats=&lums=&sel=

Facebook   Google+   Xing   Twitter