Die besten Farbfunktionen in CSS?

Ich habe schon gesagt, dass HSL das beste Farbformat ist, das wir haben. Die meisten von uns sind nicht wie David Desandro, der Hex -Codes lesen kann. HSL (a) ist Farbton, Sättigung, Leichtigkeit und Alpha, wenn wir es brauchen.

 HSL (120, 100%, 40%)

Hue ist nicht intuitiv, aber es ist nicht so seltsam. Sie machen eine Reise um das Farbrad von 0 bis 360. Die Sättigung ist offensichtlicher, wenn 0% die Farbe ausschüttelt, wie Graustufen, und 100% ist in diesem Farbton eine vollbezogene Farbe. Die Leichtigkeit ist bei 50% „normal“ und fügt Weiß oder Schwarz hinzu, wenn Sie 100% bzw. 0% aufnehmen. Ich bin sicher, das ist nicht die richtige wissenschaftliche oder technische Art, es zu erklären, aber das ist die Gehirnlogik.

Es gibt immer noch Probleme bei der Verwendung von HSL, die Brian Kardell eingehend erklärt. Ich bin weit entfernt von einem Farbsexperten, aber ich denke, ich sehe, was Brian (und Adam) in diesem Artikel sagen. Angenommen, Sie haben drei verschiedene Farben und alle haben genau die gleiche Leichtigkeit in HSL. Das bedeutet nicht, dass sie alle tatsächlich die gleiche Leichtigkeit sind. Das ist ein bisschen seltsam, besonders wenn Sie dieses Farbformat als Teil eines Farbensystems verwenden.

Die gute Nachricht ist, dass es Farbfunktionen gibt, die bereits als CSS Level 4 -Modul speziell sind, die dabei helfen: Lab und LCH. Schauen Sie sich das Beispiel von Adam an, in dem die Farben im Labor Werte aufweisen, die ihre tatsächliche Leichtigkeit viel genauer auf die Wahrnehmung der Wahrnehmung der Wahrnehmung widerspiegeln.

HSL vs Lab :: Leichtigkeit?

Dieselben Farben aus unserer schwierigen Farbumfrage, aber diesmal habe ich Labors Version derselben Farbe darüber gezeigt. Beachten Sie, wie viel genauerer Labor -Wert für die Ergebnisse unserer Umfrage ist!

? Farbräume sind nicht alle gleich! https://t.co/Aies0amdwy pic.twitter.com/xkeguq3kzg

- Adam Argyle (@Argyleiink) 3. Dezember 2019

Brian:

Es gibt Farbräume wie Labor und LCH, die sich mit dem gesamten Spektrum befassen und Eigenschaften wie Wahrnehmungsuniformheit aufweisen. Wenn wir also großartige Farbfunktionen für den Einsatz in realen Designsystemen wünschen, scheint jeder zuzustimmen, dass die Unterstützung der Mathematik im Labor-/LCH -Farbbereich die ideale Funktionsfunktion ist.

Im Fehlerticket für Chrome ist Tab der Ansicht, dass diese fast trivial sind.

Beachten Sie, dass Lab ()/lch ()/Gray () alle eifrig in unsere vorhandene Farbinfrastruktur umgewandelt werden kann. Sie führen keine grundlegend neuen Konzepte ein, sondern sind nur eine bessere Möglichkeit, Farben anzugeben, enger mit der Funktionsweise unserer Augen verbunden, anstatt eng mit der Funktionsweise von RGB -Pixeln verbunden zu sein.

Die Konvertierungsfunktionen, um es in RGB zu verwandeln, sind ein bisschen Code, aber es sind nur einige Exponentiale und ein bisschen Matrixmultiplikation und in der Spezifikation gut dokumentiert.

Ich denke, dies sollte eine gute Art von Dingen sein.

Das obige ist der detaillierte Inhalt vonDie besten Farbfunktionen in CSS?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!