Leiten Sie die Farbpalette aus einem gegebenen Satz von Farben ab

Ich habe eine Reihe von Farben auf einer Webseite, auf der eine Farbe die Hauptfarbe ist:

#864062 <-- main color
#853f61
#925071
#541c38
#64304A
#eac9d7

Nun möchte ich für jede beliebige Hauptfarbe ein ähnliches Farbschema ableiten.

Meine Idee war:

  1. Alle Farben in Dezimalschreibweise umwandeln (r, g, b)
  2. Berechnen Sie das Verhältnis der einzelnen Komponenten für jede andere Farbe und Hauptfarbe
  3. Verwenden Sie diese Raten als Umrechnungsmatrix für jede andere Hauptfarbe.

Für mein Beispiel ist rgb einzelner Farben:

134  64  98
133  63  97
146  80 113
84   28  56
100  48  74
234 201 215

Verhältnis jeder Komponente (andere Farbe / Hauptfarbe):

0.99 0.98 0.99
1.09 1.25 1.15
0.63 0.44 0.57
0.75 0.75 0.76
1.75 3.14 2.19

Jetzt kann ich für jede neue Hauptfarbe alle anderen Farben berechnen:

100 100 100 <-- new main color
 99  98  99
109 125 115
 63  44  57
 75  75  76
175 255 219 (max is 255, cannot have 314)

Meine Frage ist, ob diese Art der Berechnung sinnvoll ist, da ich noch nie mit Farben gerechnet habe.

Sehen Sie sich Adobe Kuler an . Sie können dort eine Grundfarbe und Sekundärfarben festlegen und dann die Grundfarbe mit den anderen Farben entsprechend drehen/ändern.
Wenn Sie dies auf einer Webseite verwenden, würde ich vorschlagen, einen Blick auf den Code einer anderen Person zu werfen, um zuerst zu versuchen, ihre Mathematik zu verstehen - Schauen Sie hier: github.com/c0bra/color-scheme-js (nach unten scrollen) und es erklärt, was sie tun
Ich würde Vincent zustimmen, Adobr Kuler arbeitet für mich und gibt Ihnen verschiedene Codes.

Antworten (1)

RGB ist meiner Meinung nach für Farbberechnungen schwer zu verwenden. Es ist viel einfacher, Farbschemata im HSL-Farbraum zu erstellen.

H = Hue,
S = Saturation,
L = Lightness

Die Farben werden in diese drei Werte unterteilt. Hier ist ein Beispiel für Ihre Farben in HSL:

H     S    L
331°, 35%, 39%
331°, 36%, 38%
330°, 29%, 44%
330°, 50%, 22%
330°, 35%, 29%
335°, 44%, 85%

Sie können sehen, dass der Farbton für alle Farben nahezu gleich ist. Sie können also mit einer Farbtonbasis von beginnen 330°und die Sättigung und die Helligkeit nach Ihren Wünschen anpassen.

Wenn Sie dieses Schema nun auf eine grünliche Farbe anwenden möchten, können Sie den Farbtonwert auf ändern 112°und ein passendes grünes Farbschema erhalten.