Es gibt so viele Werkzeuge, die dir bei der Farbauswahl helfen. Ich verstehe das vollkommen! Es ist schwierig! Wenn Farben gut gemacht sind, ist es wie Magie. Es verleiht einem Design eine Ebene der Perfektion, die es wirklich hervorheben kann.
Schauen wir uns einige an und sprechen dann weiter über diese Idee.
Hier ist eines, das ich gerade gesehen habe und das Color Koala heißt
Es spuckt dir fünf Farben aus und du bist schon auf dem Weg.
Hue gibt dir auch welche.
Es gibt noch eine Milliarde mehr, und sie unterscheiden sich natürlich in Ansatz und Funktionen. Hier ist eine Handvoll
- http://color.farm/
- https://coolors.co/
- https://color.adobe.com/
- http://clrs.cc/
- https://www.colourlovers.com/
- https://flatuicolors.com/
- https://colordrop.io/
- http://www.0to255.com/
- http://materialcolors.com/
- https://material.io/collections/color/
- https://www.materialpalette.com/
- https://colorhunt.co/
- https://www.palettable.io/
- https://www.webdesignrankings.com/resources/lolcolors/
- https://hihayk.github.io/wheel/
- https://htmlcolorcodes.com/
- https://www.vanschneider.com/colors
Dann gibt es Werkzeuge, die sich auf Farbverläufe konzentrieren, wie UI Gradients, Web Gradients und Shapy.
Oh! Und eine Seite, die bei Textfarben hilft und dabei die Barrierefreiheit im Auge behält.
Es gibt sogar native Apps wie Sip, ColorSnapper und Frank DeLoupe, die dir bei der Farbauswahl helfen und deine Paletten manchmal direkt darin aufbewahren.
Farben können programmatisch generiert werden.
Es gibt keine native JavaScript-API dafür, aber es ist trotzdem im Grunde eine Einzeiler
Siehe den Pen Generiere neue zufällige Hex-Farbe mit JavaScript von Chris Coyier (@chriscoyier) auf CodePen.
Ansprechende Farben können das auch sein.
Das Generieren von zufälligen Farben garantiert keine ansprechenden Paletten, besonders wenn eine Menge zufälliger Farben zusammengepaart werden. PleaseJS kann helfen, Farbschemata zu erstellen, die zusammenarbeiten. Du gibst ihm eine Basisfarbe und andere Optionen (wie den Typ des Farbschemas) und es spuckt dir Farben aus.
Siehe den Pen Generiere ansprechende Farben von Chris Coyier (@chriscoyier) auf CodePen.
Ähnlich, randomColor.js…
erzeugt von Haus aus ansprechende Farben. Genauer gesagt, erzeugt randomColor helle Farben mit einer relativ hohen Sättigung. Das macht randomColor besonders nützlich für Datenvisualisierungen und generative Kunst.
Es beansprucht nicht, mehrere Farben zu einem kohärenten Thema zu machen, abgesehen vom Übergeben einer Basis-Farbton oder Luminosität.
Siehe den Pen Generiere ansprechende Farben von Chris Coyier (@chriscoyier) auf CodePen.
Aber das Problem, einfach Farben überreicht zu bekommen, ist…
…dass sie dir nicht genau sagen, wie du sie verwenden sollst. Steve Schoger weist darauf in einem Blogbeitrag, eher auf humorvolle Weise, hin. Dies ist eine vollkommen schöne Farbpalette
Aber wenn du diese Farben einfach auswählst und sie auf ein Design legst, könntest du mit etwas wie diesem enden
Das gefällt dir vielleicht, aber du wärst in der Minderheit. Es ist kein verfeinertes Design, das sich zurückhält und jeden Tag angenehm zu nutzen wäre. Die Verwendung von Farben ist etwas komplizierter, als fünf schöne Farben in ein Design zu packen. Es sind Variationen davon und deren geschmackvolle Verwendung, wie hier
Das Buch von Steve Schoger und Adam Wathan hat sicher einige Ratschläge für dich!
Falls du es noch nicht gesehen hast, Lyft hat kürzlich etwas ziemlich Interessantes im Bereich Farbe + Code veröffentlicht: https://www.colorbox.io/
Mehr dazu hier: https://design.lyft.com/re-approaching-color-9e604ba22c88
Ich benutze auch coolors.co, um meine Farben in SASS-Variablen zu benennen, da es ihnen einen Namen gibt.
Um nur ein weiteres Werkzeug hinzuzufügen, ist Paletton eines meiner Lieblingswerkzeuge. Es kann etwas mehr Arbeit erfordern, um etwas Ansprechendes zu finden, aber es bietet viel Kontrolle darüber, wie die Farben zueinander stehen, insbesondere für komplementäre Schemata. Es ist ein bisschen altmodisch, aber ich mag es.
Ich liebe die Darstellung von Schemata in Hue wirklich. Es gibt ein wirklich gutes Verständnis dafür, wie die Farben im Projekt verwendet werden. Danke für den Beitrag!
Tolle Sammlung!
Eine kurze Anmerkung: Der Einzeiler-JS-Farbgenerator scheint Probleme mit einer bestimmten Untermenge von Farben zu haben, da führende Nullen nicht angegeben werden, wenn der toString()-Aufruf weniger als 6 Zeichen zurückgibt.
Ein paar von Product Hunt in den letzten paar Tagen.
Erstelle Paletten mit der Material Design-Logik: https://materialpalettes.com
Erzeuge Tönungen und Schattierungen aus einer Basisfarb-Hexadezimalfarbe: https://maketintsandshades.com
Erik Kennedy schickt mir
Ich liebe eigentlich, wie das Design aussieht, wenn du diese Farben zufällig darauf geworfen hast. Der Punkt ist, es ist einfach so verdammt kühn, dass Designer es selten als „gut“ betrachten oder es gar produzieren würden.