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.

#fffc00
rgb(255, 252, 0)

hex : #fffc00
rgb : rgb(255, 252, 0)
hsl : hsl(59.294, 100%, 50%)
Name : Gold
HEX : #FFFC00
RGB : 255, 252, 0
HSL : 59.294, 1, 0.5
HSL % : 59.294, 100, 50
HSV : 59.294, 1, 1
HSV % : 59.294, 100, 100
CMY : 0, 0.012, 1
CMYK % : 0%, 1.2%, 100%, 0%
XYZ : 76.05, 90.881, 13.533
CIELAB : 96.361, -20.131, 93.916


Komplementärfarbe

Die Komplementärfarbe ist jene Farbe, welche auf der anderen Seite des Farbenkreises zu finden ist.
#0004ff
rgb(0, 4, 255)


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.
#ff7b00
rgb(255, 123, 0)
#fffc00
rgb(255, 252, 0)
#84ff00
rgb(132, 255, 0)


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.
#ffbb00
rgb(255, 187, 0)
#fffc00
rgb(255, 252, 0)
#c4ff00
rgb(196, 255, 0)


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.
#fffc00
rgb(255, 252, 0)
#00fffb
rgb(0, 255, 251)
#fb00ff
rgb(251, 0, 255)


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.
#fffc00
rgb(255, 252, 0)
#00fffb
rgb(0, 255, 251)
#fb00ff
rgb(251, 0, 255)


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.
#fffc00
rgb(255, 252, 0)
#0084ff
rgb(0, 132, 255)
#7b00ff
rgb(123, 0, 255)


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.
#fffc00
rgb(255, 252, 0)
#00bbff
rgb(0, 187, 255)
#0004ff
rgb(0, 4, 255)
#ff4400
rgb(255, 68, 0)


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.
#fffc00
rgb(255, 252, 0)
#4dff00
rgb(77, 255, 0)
#0004ff
rgb(0, 4, 255)
#b300ff
rgb(179, 0, 255)


Quadratisches Farbschema

Beim quadratischen Farbschema werden vier Farben gleichmäßig über den Farbkreis verteilt.
#fffc00
rgb(255, 252, 0)
#00ff7b
rgb(0, 255, 123)
#0004ff
rgb(0, 4, 255)
#ff0084
rgb(255, 0, 132)


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.
#fffc00
rgb(255, 252, 0)
#00ff2f
rgb(0, 255, 47)
#009dff
rgb(0, 157, 255)
#9500ff
rgb(149, 0, 255)
#ff0037
rgb(255, 0, 55)


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.
#fffc00
rgb(255, 252, 0)
#04ff00
rgb(4, 255, 0)
#00fffb
rgb(0, 255, 251)
#0004ff
rgb(0, 4, 255)
#fb00ff
rgb(251, 0, 255)
#ff0004
rgb(255, 0, 4)


Aufhellung

Die Aufhellung der Farbe ergibt sich durch eine Erhöhung der Helligkeit bis hin zu weiß.
#fffb00 | rgb(255, 251, 0)
#fffb24 | rgb(255, 251, 36)
#fffc49 | rgb(255, 252, 73)
#fffd6d | rgb(255, 253, 109)
#fffd92 | rgb(255, 253, 146)
#fffeb6 | rgb(255, 254, 182)
#fffedb | rgb(255, 254, 219)
#ffffff | rgb(255, 255, 255)


Schatten und Schattierung

Die Schattenfarben ergeben sich durch eine Reduzierung der Helligkeit der Farbe bis hin zu Schwarz.
#fffb00 | rgb(255, 251, 0)
#dbd700 | rgb(219, 215, 0)
#b6b300 | rgb(182, 179, 0)
#928f00 | rgb(146, 143, 0)
#6d6b00 | rgb(109, 107, 0)
#494800 | rgb(73, 72, 0)
#242400 | rgb(36, 36, 0)
#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.
#fffb00 | rgb(255, 251, 0)
#ede912 | rgb(237, 233, 18)
#dbd824 | rgb(219, 216, 36)
#c8c637 | rgb(200, 198, 55)
#b6b449 | rgb(182, 180, 73)
#a4a35b | rgb(164, 163, 91)
#92916d | rgb(146, 145, 109)
#808080 | rgb(128, 128, 128)


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.
#fffb00 | rgb(255, 251, 0)


convert-color-hues

convert-color-hues-explanation
#fffb00 | rgb(255, 251, 0) | hsl(59.059, 1,0.5)
#a6ff00 | rgb(166, 255, 0) | hsl(80.941, 1,0.5)
#44ff00 | rgb(68, 255, 0) | hsl(104, 1,0.5)
#00ff1a | rgb(0, 255, 26) | hsl(126.118, 1,0.5)
#00ff7b | rgb(0, 255, 123) | hsl(148.941, 1,0.5)
#00ffd9 | rgb(0, 255, 217) | hsl(171.059, 1,0.5)
#00c4ff | rgb(0, 196, 255) | hsl(193.882, 1,0.5)
#0066ff | rgb(0, 102, 255) | hsl(216, 1,0.5)
#0004ff | rgb(0, 4, 255) | hsl(239.059, 1,0.5)
#5900ff | rgb(89, 0, 255) | hsl(260.941, 1,0.5)
#bb00ff | rgb(187, 0, 255) | hsl(284, 1,0.5)
#ff00e6 | rgb(255, 0, 230) | hsl(305.882, 1,0.5)
#ff0084 | rgb(255, 0, 132) | hsl(328.941, 1,0.5)
#ff0026 | rgb(255, 0, 38) | hsl(351.059, 1,0.5)
#ff3c00 | rgb(255, 60, 0) | hsl(14.118, 1,0.5)
#ff9900 | rgb(255, 153, 0) | hsl(36, 1,0.5)


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: 80(-20)
1
2
3
4
5
1
#570f8a
rgb(87, 15, 138)
#8a0f2a
rgb(138, 15, 42)
#8a880f
rgb(138, 136, 15)
#0f8a26
rgb(15, 138, 38)
#0f5b8a
rgb(15, 91, 138)
2
#911ae6
rgb(145, 26, 230)
#e61a46
rgb(230, 26, 70)
#e6e21a
rgb(230, 226, 26)
#1ae63f
rgb(26, 230, 63)
#1a97e6
rgb(26, 151, 230)
3
#bd75f0
rgb(189, 117, 240)
#f07590
rgb(240, 117, 144)
#f0ee75
rgb(240, 238, 117)
#75f08c
rgb(117, 240, 140)
#75c1f0
rgb(117, 193, 240)
Saturation: 100(0)
1
2
3
4
5
4
#590099
rgb(89, 0, 153)
#990021
rgb(153, 0, 33)
#999600
rgb(153, 150, 0)
#00991c
rgb(0, 153, 28)
#005e99
rgb(0, 94, 153)
5
#9500ff
rgb(149, 0, 255)
#ff0037
rgb(255, 0, 55)
#fffb00
rgb(255, 251, 0)
#00ff2f
rgb(0, 255, 47)
#009dff
rgb(0, 157, 255)
6
#bf66ff
rgb(191, 102, 255)
#ff6687
rgb(255, 102, 135)
#fffc66
rgb(255, 252, 102)
#66ff82
rgb(102, 255, 130)
#66c4ff
rgb(102, 196, 255)
Saturation: 100(+20)
1
2
3
4
5
7
#590099
rgb(89, 0, 153)
#990021
rgb(153, 0, 33)
#999600
rgb(153, 150, 0)
#00991c
rgb(0, 153, 28)
#005e99
rgb(0, 94, 153)
8
#9500ff
rgb(149, 0, 255)
#ff0037
rgb(255, 0, 55)
#fffb00
rgb(255, 251, 0)
#00ff2f
rgb(0, 255, 47)
#009dff
rgb(0, 157, 255)
9
#bf66ff
rgb(191, 102, 255)
#ff6687
rgb(255, 102, 135)
#fffc66
rgb(255, 252, 102)
#66ff82
rgb(102, 255, 130)
#66c4ff
rgb(102, 196, 255)

Selected Colors

#911ae6
rgb(145, 26, 230)
#e6e21a
rgb(230, 226, 26)

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/fffc00//?hues=&sats=&lums=&sel=

Facebook   Google+   Xing   Twitter