Die besten Website-Farbpaletten zur Steigerung des Engagements im Jahr 2020

Ist das Farbschema, das Sie für Ihre Website ausgewählt haben, das eine gewünschte Antwort auslöst? Sind Sie von der Anzahl potenzieller Website-Farbpaletten überwältigt?

Jeder hat Lieblingsfarben, zu denen er sich neigt, wenn es um seine Arbeit oder auf andere Weise geht.,

Ein erfahrener Designer versteht jedoch, wie wichtig es ist, ein Farbschema basierend auf der Marke, den Bedeutungen der Farben und den beworbenen Produkten oder Dienstleistungen zu bewerten.

Gute Farbauswahl nehmen sorgfältige Planung.

Sie können beeinflussen, wie ein Besucher das, was er sieht, genauso interpretiert wie das Layout und die Typografie einer Website — und wenn sie gut gemacht sind, können sie sich positiv auf die Bewertung der Marke als Ganzes durch jeden Besucher auswirken.,

In diesem Artikel werfen wir einen Blick darauf, warum die Auswahl der richtigen Farben für Ihre Website wichtig ist, sowie 23 verschiedene Farbpaletten von echten Websites, die die Aufmerksamkeit der Besucher auf sich ziehen.

Warum ist Ihr Farbschema so wichtig?

Bevor wir in den Prozess der Auswahl eines Farbschemas für Ihre Website springen, ist es wichtig, genau zu verstehen, warum Ihre Website Farbschema so wichtig ist.

Schließlich denken Sie vielleicht, dass es der Inhalt ist, der wirklich wichtig ist. Und das ist nicht unwahr.

Menschen lieben Inhalte., Sie werden von frischen Stimmen und verlockenden Informationen angezogen, aber Sie müssen zuerst ihre Aufmerksamkeit auf sich ziehen. Hier kommen Website-Farbpaletten ins Spiel.

Wenn Sie das richtige Website-Farbschema auswählen, haben Sie die Möglichkeit, Ihre Besucher mit Ihren Inhalten zu überraschen.

So geht ‚ s:

Markenbekanntheit schaffen

Ihre Website ist im Wesentlichen das Zuhause Ihres Unternehmens online.

Das bedeutet, es muss eine genaue Darstellung Ihrer Marke. Und darüber hinaus muss es unvergesslich genug sein, dass Benutzer nach ihrem ersten Besuch zurückkehren.,

Schließlich sind viele Ihrer Besucher während ihres ersten Besuchs nicht bereit, einen Kauf oder eine andere größere Umstellung vorzunehmen — und sie müssen sich an Ihr Unternehmen erinnern, um zurück zu kommen und diese Maßnahmen zu ergreifen.

Glücklicherweise erhöht Farbe die Markenbekanntheit um 80%.

Wenn Ihr Unternehmen bereits über ein etabliertes Farbschema verfügt, ist es wichtig, dies in das Design Ihrer Website aufzunehmen. Dadurch wird es für Besucher viel einfacher, es sofort mit anderen Orten zu verbinden, an denen sie Ihre Marke gesehen haben.,

Wenn Ihr Farbschema auf Ihrer gesamten Website konsistent ist, wissen sie, dass sie bei Ihrer Rückkehr an die richtige Stelle gekommen sind, unabhängig von der genauen Seite, auf der sie landen.

Abgesehen davon, Benutzern mitzuteilen, wer Ihr Unternehmen ist, spielt Ihr Webdesign auch eine wichtige Rolle bei den Snap-Urteilen der Benutzer über Ihre Marke.

Laut einer Umfrage nannten 94 Prozent der Befragten Webdesign zu den Haupttreibern der ersten Eindrücke von Websites.

Natürlich beinhaltet Webdesign viel mehr als nur Farbe.,

Da Farbe jedoch eines der offensichtlichsten Elemente auf Ihrer Website ist und eines der wenigen Elemente, die ein Benutzer innerhalb dieser ersten 50 Millisekunden erkennen kann, kann Ihre Palette die Bewertung eines Benutzers vornehmen oder unterbrechen Ihres Unternehmens.

Form, wie die Besucher das Gefühl haben, über Ihre Website

In einer weiteren Studie auf, wie Verbraucher die ersten Eindrücke gebildet werden, 90 Prozent der ersten Bewertungen basieren auf Farbe allein.

Bis zu einem gewissen Grad ist der Grund dafür klar.

Schließlich ist Farbe einer der am einfachsten zu verstehenden Aspekte einer Seite.,“Es kann fast augenblicklich bewertet werden und erfordert keine Besucher Kopie oder andere Messaging zu bewerten.

Aber es ist auch wichtig, die Rolle zu berücksichtigen, die die Psychologie der Farbe in diesen momentanen Urteilen spielt.

Viele Unternehmen nutzen diese Verbindungen, wie die Logos in der folgenden Tabelle zeigen.

Zum Beispiel neigen Marken, die ein Gefühl von Kreativität und Vorstellungskraft schaffen wollen, dazu, Lila in ihre Bilder zu integrieren, während Marken, die ein Gefühl des Gleichgewichts und der Ruhe schaffen wollen, sich zu Schwarz und Weiß neigen.,

Dies knüpft direkt an die „Persönlichkeit“ an, die Ihre Marke haben soll.

In einer Studie zur Markenpersönlichkeit kam die Psychologin und Stanford-Professorin Jennifer Aaker zu dem Schluss, dass fünf Kerndimensionen eine Rolle in der Persönlichkeit einer Marke spielen:

Marken können manchmal Merkmale mischen, aber zum größten Teil konzentriert sich ihre“ Persönlichkeit “ hauptsächlich auf eine. Ein Unternehmen, das zum Beispiel Campingausrüstung verkauft, würde sich mit „Robustheit“ identifizieren, während eine Modemarke auf „Raffinesse“ abzielen könnte.,“

Und wie Sie in der Logotabelle oben sehen können, kann Farbe eine wichtige Rolle spielen, um den Verbrauchern zu zeigen, wie die Persönlichkeit Ihrer Marke ist.

Obwohl die meisten vielleicht nicht bewusst erkennen, dass das rote Logo eines Unternehmens ein Gefühl der Aufregung erzeugen soll, kann es genau das tun.

Und während jede Farbe dazu dienen kann, ein bestimmtes Gefühl oder eine bestimmte Reaktion zu erzeugen, sind bestimmte Farben für die meisten Marken und Websites eine bessere Wahl als andere.

Zum Beispiel wird Blau oft als die sicherste Wahl angesehen., Dies liegt zum Teil daran, dass es die häufigste „Lieblingsfarbe“ unter der Mehrheit der Bevölkerung ist.

Tatsächlich sagen 57% der Männer und 35% der Frauen, dass es ihre Lieblingsfarbe ist.

Wenn Sie also ein breites Publikum ansprechen möchten, ist dies eine gute Wahl für Ihre Website. In der Tat könnte dies der Grund sein, warum einige der meistbesuchten Websites heute, wie Facebook und Twitter, es für ihre Logos und Branding verwenden.

Es ist auch erwähnenswert, dass Blau häufig auch mit Gefühlen von Vertrauen, Autorität und Zuverlässigkeit verbunden ist.,

Aber das bedeutet nicht, dass es die beste Wahl für jede Website ist. Es hängt alles von dem Gefühl ab, das Sie Ihren Besuchern vermitteln möchten.

Wenn sich Ihre Marke beispielsweise auf Gesundheit und Wellness konzentriert, könnte Grün eine bessere Option für die Schaffung dieser Assoziation sein. Und wenn Sie Ihre Besucher begeistern und sie dazu bringen möchten, schnell Maßnahmen zu ergreifen, könnte Red Ihnen dabei helfen, dieses Ziel zu erreichen.

Wenn Sie also Farben für Ihre Website auswählen, berücksichtigen Sie die emotionalen Reaktionen, die sie bei Ihren Besuchern auslösen können.,

Wenn Sie beispielsweise versuchen, ein Gefühl der Ruhe für die Website Ihres Yoga-Studios zu schaffen, ist Rot möglicherweise nicht die beste Wahl — und das sollten Sie wissen, bevor Sie ernsthaft Geld in Ihr Design investieren.

Entwickeln Sie ein Gefühl der Ordnung

Abgesehen von den emotionalen Reaktionen, die die einzelnen Farben, die Sie wählen, hervorrufen können, ist es auch notwendig, die Art und Weise zu berücksichtigen, wie die Farben auf Ihrer Website miteinander interagieren.

Der beste Weg, dies zu tun, ist, ein paar Grundprinzipien der Farbtheorie zu betrachten.,

Wenn Sie jemals eine Kunstklasse besucht oder sich designbezogene Ressourcen angesehen haben, haben Sie wahrscheinlich etwas Ähnliches gesehen wie das Farbrad in der obigen Grafik.

Das gebräuchlichste Konzept, das in diesem Rad dargestellt wird, ist die Beziehung zwischen Primärfarben (Rot, Gelb und Blau) und den Sekundär-und Tertiärfarben, die durch Mischen gebildet werden.

Aber darüber hinaus kann dieses Rad Ihnen helfen, Farbharmonie oder eine optisch ansprechende Anordnung von Farben zu schaffen., Eine harmonische Webdesign-Palette kann Ihnen helfen, ein Gefühl von Gleichgewicht und Ordnung zu schaffen.

Es gibt drei weithin akzeptierte Arten von Farbschemata, mit denen Sie diese Art von Harmonie herstellen können: analog, monochromatisch und komplementär.

Ein analoges Farbschema besteht aus Farben, die nebeneinander auf das Farbrad fallen. Dies ist eine der schwierigsten Paletten, da sich die Farben leicht gegenseitig überwältigen können.

Davon abgesehen sind analoge Farbschemata auch einige der lebendigsten.,

Wenn Sie also eine farbenfrohe, visuell interessante Site erstellen möchten, können Sie eine Palette verwenden, die den folgenden drei Beispielen ähnelt:

Ein monochromatisches Farbschema fällt auf das entgegengesetzte Ende des Spektrums des vorherigen Typs. Wie der Name schon sagt, besteht es aus einer Hauptfarbe, aber die Intensität und Leichtigkeit der Farbtöne variieren.

Diese Paletten sind am einfachsten zu erstellen und am“ sichersten “ zu implementieren, da unterschiedliche Farbtöne derselben Farbe selten zusammenstoßen oder sich zu beschäftigt anfühlen.,

Wenn Sie also einen relativ einfachen Blick auf Ihre Website werfen, könnte ein monochromatisches Farbschema wie diese drei für Ihre Marke gut funktionieren:

Schließlich liegt eine komplementäre Palette in Bezug auf Vielfalt irgendwo zwischen analogen und monochromatischen Schemata.

Es besteht aus Farben, die auf dem Farbrad direkt gegenüber liegen. Während es also mehr Farben beinhaltet, ergänzen sich diese Farben natürlich und werden die Besucher nicht überwältigen.,

Wenn Sie etwas Abwechslung in Ihr Farbschema aufnehmen möchten, ohne dass Ihre Website zu beschäftigt erscheint, könnte ein komplementäres Farbschema wie eines davon die perfekte Wahl sein:

Natürlich sind diese drei nicht die einzigen Arten von Farbschemata, die Sie erstellen können. In der Tat variieren die besten Palettentypen je nachdem, wen Sie fragen.

Ein triadisches Farbschema ist eine der Hauptoptionen.

Bei diesem Farbschema werden drei Farben verwendet, die sich 120 Grad voneinander auf dem Farbrad befinden., In der obigen Grafik sind diese Farben orange, grün und lila.

Wenn Sie Ihre Farben auswählen, denken Sie daran, dass die oben aufgeführten Typen keine endgültigen Regeln sind. Sie können Ihnen eine allgemeine Vorstellung von dem allgemeinen Gefühl geben, das Ihre Website haben soll, aber sie sind keineswegs die einzigen Möglichkeiten, eine Palette zu erstellen, die für Ihre Marke funktioniert.

Unabhängig von der Art der Palette, die Sie verwenden, können Sie damit eine Hierarchie der wichtigsten Inhalte auf jeder Ihrer Seiten erstellen.,

Bestimmte Elemente hervorheben

Wie bereits im vorherigen Abschnitt erwähnt, kann eine definierte Farb-Website-Palette hilfreich sein, um anzuzeigen, dass bestimmte Elemente wichtig sind.

Sie können diese Wirkung maximieren, indem Sie den Isolationseffekt berücksichtigen, wenn Sie bestimmen, wie Sie Ihr Farbschema auf Ihren Seiten verwenden.

Die allgemeine Idee hinter diesem psychologischen Prinzip ist, dass je mehr ein Gegenstand auffällt, desto wahrscheinlicher ist es, dass er bemerkt und erinnert wird.,

Stellen Sie sicher, dass die Farben, die Sie wählen, Ihnen die Möglichkeit geben, bestimmte Aufrufe zum Handeln auf Ihren Seiten hervorzuheben, ohne mit dem Rest Ihres Designs zu kollidieren.

Dieser Ansatz entspricht auch den Vorlieben der meisten Verbraucher.

In zwei Studien, Ästhetische Reaktion auf Farbkombinationen und Verbraucherpräferenzen für Farbkombinationen, fanden die Forscher heraus, dass Verbraucher zwar Farbkombinationen mit ähnlichen Farbtönen bevorzugen, aber auch Paletten mit einer stark kontrastierenden Akzentfarbe bevorzugen.,

Die erste Studie zeigte, dass “ Paarpräferenz und Harmonie beide zunehmen, wenn die Farbtonähnlichkeit zunimmt.“Aber“ obwohl Paare mit stark kontrastierenden Farbtönen im Allgemeinen weder als vorzuziehen noch als harmonisch eingestuft werden, nehmen die Bewertungen der figuralen Farbpräferenz zu, wenn der Farbtonkontrast mit dem Hintergrund zunimmt.“

In der zweiten Studie fanden Forscher heraus, dass „Menschen im Allgemeinen gerne Farben kombinieren, die relativ nahe oder genau übereinstimmen, mit der Ausnahme, dass einige Leute eine Signaturproduktkomponente hervorheben, indem sie kontrastierende Farbe verwenden.,“

Obwohl Ihre Akzentfarbe einen starken Kontrast haben sollte, ist es in Ordnung — und sogar vorzuziehen—, wenn der Rest Ihrer Palette aus relativ ähnlichen Farbtönen besteht.

Dies bedeutet, dass das Erstellen von Webdesign-Paletten, die eine starke, aufmerksamkeitsstarke Akzentfarbe enthalten, nicht nur zum Isolieren bestimmter Elemente wirksam ist, sondern auch eine großartige Möglichkeit ist, eine Kombination zu erstellen, die vielen Ihrer Besucher gefallen wird.

Designbezogene Entscheidungen vereinfachen

Wenn es darum geht, eine Website oder ein Unternehmen (oder beides!), es ist immer eine gute Idee auf der Suche nach Möglichkeiten zur Vereinfachung der grundlegenden Prozesse.,

Je weniger Zeit Sie für grundlegende Aufgaben aufwenden, desto mehr Zeit müssen Sie für Prozesse und Entscheidungen aufwenden, die einen größeren Einfluss auf Ihren Erfolg haben.

Und die Einrichtung von Webdesign-Paletten ist eine großartige Möglichkeit, die Zeit zu verkürzen, die zum Erstellen neuer Seiten benötigt wird. Wenn Sie ein etabliertes Farbschema haben, erleichtern Sie grundlegende Designentscheidungen sowohl für sich selbst als auch für Ihre Designer und Entwickler erheblich.,

Dies gilt insbesondere dann, wenn Sie sich die Zeit nehmen, Ihre Palette auf einfach zu bedienende Weise zu dokumentieren:

Wenn Sie ein benutzerfreundliches Dokument Ihrer Palette erstellen, erstellen Sie eine Ressource auf einen Blick mit allen möglichen Optionen für jedes Element.

Wenn Sie (oder Ihre Designer) Probleme haben, die Farbe für eine CTA-Schaltfläche zu bestimmen, können Sie einfach auf das Dokument verweisen, um eine vollständige Liste Ihrer Optionen zu erhalten.,

Anstatt also Ihr Gehirn für all die verschiedenen Möglichkeiten zu zerbrechen, können Sie aus einer voreingestellten Liste von Farben wählen. Und sobald Sie einige auswählen, die Sie verwenden oder testen möchten, sind alle HEX-und RGB-Codes bereits direkt vor Ihnen.

Wie viele Farben sollten Sie integrieren?

Alles hängt von der Komplexität Ihres Designs und den Arten von Farbkombinationen ab. Wenn Sie beispielsweise eine monochromatische Webdesign-Palette verwenden, benötigen Sie möglicherweise sieben oder sogar mehr Farbtöne dieser Farbe, um genügend Abwechslung auf dem Bildschirm zu erzielen.,

Sie möchten Farben für bestimmte Teile Ihrer Website angeben, z. B. Text, Hintergründe, Links, Link-Hover-Farben, CTA-Schaltflächen und Überschriften.

So wählen Sie ein Website-Farbschema

Wenn Sie nicht sicher sind, wie Sie die besten Webdesign-Farbpaletten auswählen, schauen Sie sich dieses Video an, das ich erstellt habe. Es führt Sie durch praktische Tipps zur Auswahl eines Website-Farbschemas.

Im Idealfall spiegeln Website-Farbpaletten die Werte, Überzeugungen und den Zweck eines Unternehmens wider., Laute Farben können auf eine weniger formelle Atmosphäre und mehr Aufregung hinweisen, während gedämpfte Farben dem Geschäft eine raffiniertere oder formellere Note verleihen.

Aber das ist nicht immer einfach zu übersetzen, wenn man Tausende von möglichen Farbkombinationen anstarrt. Schauen wir uns 23 großartige Website-Farbpaletten an, mit denen Sie das Engagement steigern können.

16 Großartige Website-Farbpaletten zur Steigerung des Engagements (2020)

Die folgenden Websites verwenden verschiedene Website-Farbpaletten mit großer Wirkung. Sie werden sorgfältig für die Emotionen ausgewählt, die sie hervorrufen und die Gefühle, die sie vermitteln.,

Mea Cuppa

Die Mea Cuppa-Website verwendet eine auffällige Farbpalette, die einige Juwelentöne (Rubin und Smaragd) für maximale Lebendigkeit enthält, ansonsten jedoch auf einer neutralen, monochromatischen Palette von Braun-und Grautönen beruht.

Die Webdesign-Palette ruft ein Café-Feeling hervor und spiegelt sich im Heldenbild der Website wider, das Zusammenhalt schafft.

Die Großen Top

BigTop ist eine community, die darauf spezialisiert, Start-UPS Netzwerk., Die Website verwendet eine ungewöhnliche, aber äußerst aufmerksamkeitsstarke Kombination von Juwelentönen, die von Lila und Blau bis hin zu leuchtendem Orange und Gelb reichen.

Die primären farben sind alle kühlen farben, die macht die wärmer farben pop. Sie werden im Screenshot der Homepage feststellen, dass der orange und gelbe CTA Ihre Aufmerksamkeit vor allem auf sich zieht.

Tori ’s Eye

Unser drittes Beispiel stammt vom Twitter-Visualisierungstool Tori ‚ s Eye. Dies ist ein großartiges Beispiel für ein meist monochromatisches Farbschema., Hier sehen wir die Auswirkungen einer einfachen, aber leistungsstarken Farbpalette, die sich um Grüntöne dreht.

Dieses Farbschema ist oft leicht abziehbar, da ein Farbton fast immer mit einem anderen Farbton derselben Farbe funktioniert.

BarkBox

Die vorherrschende rosa Farbe an der BarkBox homepage wiederholt sich auf der gesamten Website in verschiedenen Farbtönen. Es kontrastiert wunderschön mit der blauen Farbe, die in den Logos und CTAs auf der gesamten Website verwendet wird.,

Wenn Sie Komplementärfarben verwenden, um die Aufmerksamkeit der Besucher dort zu lenken, wo Sie möchten, kann dies zur Verbesserung jeder Website-Farbpalette beitragen.

Käse-Survival-Kit

Rot eine sehr beliebte Farbe für eine website Farbpalette. Es kann eine reiche Mischung von Emotionen vermitteln, was es sehr vielseitig macht. Es ist besonders leistungsfähig, wenn es in kleinen Dosen verwendet wird, wie Sie auf der Cheese Survival Kit-Website sehen.,

Das Rot ist mit neutraleren Farben temperiert, und das Blau hilft, CTAs und andere Bereiche, in denen das Unternehmen die Aufmerksamkeit des Besuchers auf sich ziehen möchte, zu schlagen.

Nordic Ruby

Nordic Ruby, eine Konferenz in Stockholm, hat eine wunderschöne Website in satten Juwelentönen. Die Farben, die für diese Website-Farbpalette ausgewählt wurden, verleihen ihr Raffinesse und heben sie von weniger wirkungsvollen Designs ab.,

der Lake Nona

der Lake Nona ist eine Webseite, die für einen bestimmten Ort — speziell in der Nähe des Wassers. Daher ist es nicht verwunderlich, dass hier eine blaue Farbe dargestellt wird. Die anderen neutralen Farben lassen das Blau schön hervorstechen.

LemonStand

Auch hier ist es keine Überraschung, dass ein Unternehmen namens Lemon Stand gelb in seiner Website-Farbpalette haben würde. Der Blues und Grautöne paaren sich gut mit dem Gelb und helfen, seine Helligkeit zu mildern.,

Mint

Mint ist eine Website für Finanzen, daher ist die Verwendung von Grün und Blau eine gute Wahl. Sie helfen, Ruhe, Ruhe und Vertrauen zu vermitteln. Neutrale Farbtöne in der braunen Familie machen es zu einer insgesamt erdigen Farbpalette, die die Sinne beruhigt.

Odopod

Odopod passt zur monotonen Farbpalette, vermeidet jedoch, mit einem Farbverlauf auf seiner Homepage langweilig auszusehen., Die große Typografie bietet einen hervorragenden Kontrast und es ist offensichtlich, wo Sie klicken sollen.

Fiverr

Möglicherweise stellen Sie fest, dass viele Unternehmen eine bestimmte Farbe — im Falle von Fiverr, grün — ausschließlich für CTAs reservieren. Es erscheint nicht an anderer Stelle auf der Website. Tatsächlich wurde es nicht einmal von ColorFav aufgegriffen, da es von den neutraleren Farben dominiert wird.,

Digital Photography School

Sie würden erwarten, dass ein Unternehmen, das sich auf die Grafik konzentriert, eine kommandierende Website-Farbpalette hat, und die Digital Photography School enttäuscht nicht. Die leuchtenden Farben helfen, den Betrachter hineinzuziehen. Und genau wie bei Fiverr wird das im CTA verwendete Orange nicht einmal in der Palette der Site angezeigt, da es sparsam für den Aufprall verwendet wird.,

Ahrefs

Ahrefs ist ein Beispiel für eine website, die verwendet seine Farbpalette liberal. Ein dunkleres Blau dient als dominierende Farbe, aber Variationen davon existieren auf der gesamten Website. Gleiches gilt für die Farben Orange, Pink und Teal.

Millo.co

Millo.co verwendet eine sehr einfache website Farbpalette, und es ist besser für Sie. Wir wissen genau, wo wir suchen, wenn wir eine Website wie diese besuchen.,

Brian Gardner

Einige Unternehmen und Privatpersonen nehmen die monochromatische Farbpalette, um die extreme. Brian Gardner, Webdesigner, verwendet ein Schwarz-Weiß – Farbschema, das perfekt funktioniert. Es basiert auf seiner Marke des Minimalismus, so spiegelt es seine Werte und Überzeugungen.

Weiche Farben können gut funktionieren, wenn Sie den Besucher beruhigen möchten. Loom beschäftigt liberale Dosen von Lachs und Babyblau., Es funktioniert gut, insbesondere mit der dunkleren blauen Farbe, die für CTAs und andere wichtige Elemente auf der Seite verfügbar ist.

Eine praktische Liste von Ressourcen für die Auswahl der perfekten Website-Farbpalette

Hier sind 18 Farbpalettenressourcen, mit denen Sie die perfekte Palette für Ihre Website einrichten können.

Zuerst brauchen Sie Inspiration?

1: BrandColors

BrandColors zeigt Ihnen, wie führende Marken Farbe verwenden, um ihre Geschäfte zu differenzieren, ihre Markengeschichten zu erzählen und ihre Kunden wissen zu lassen, wofür sie stehen., Sie können alphabetisch durch eine Liste von Unternehmen, gemeinnützigen Organisationen und Startups blättern oder nach Markennamen suchen.

Auf der Suche nach einer vorgefertigten Palette?

2: ColourLovers

ColourLovers ist eine forum-Website für palette design, mit fast 2 Millionen Paletten eingereicht, die von seinen Nutzern. Sie können nach Paletten suchen, die diese Farbe enthalten, nach Designern suchen oder ihnen folgen. Oft finden Sie Varianten der gleichen Palette, so dass Sie Farbton und Sättigung Optionen fertig gemacht.

(Komplett mit skurrilen Namen.,)

3: ColoRotate

ColoRotate enthält eine Bibliothek von Farbschemata, die Sie durchsuchen, auswählen und ändern können. Wenn Sie Ihre eigenen von Grund auf neu erstellen möchten, können Sie mit einem 3D-Farbwerkzeug. Und Sie können das Schema verwenden, das Sie direkt in PhotoShop oder Fireworks erstellt haben, mit dem ColorRotate-Plugin und der iPad-App.

Passen Sie Ihr Branding

Aber was ist, wenn Sie bereits Bilder, Logos oder Branding haben, dass Ihre Website Farben übereinstimmen müssen?,

4: Color Hunter

Color Hunter ist kein Werkzeug mit einer Vielzahl von Funktionen, wie einige der All-in-One-Kraftwerke auf dieser Liste. Stattdessen ist es eine solide Lösung für eine Sache: eine bestimmte Farbe aufzuspüren. Gehen Sie zur Site, legen Sie ein Bild ab und das Tool erstellt eine Palette für Sie aus dem Bild. Dies ist eine solide Möglichkeit, Farbpaletten um Bilder zu erstellen, mit denen Ihre Website harmonieren muss, und Sie können sie auch verwenden, um die Paletten von Websites, die Ihnen am besten gefallen, umzukehren.,

5: Pictaculous

Pictaculous generiert Farbpaletten aus Fotos – laden Sie ein Foto hoch, und Pictaculous schlägt Farben vor, die dazu passen. Pictaculous bietet Ihnen nicht nur eine Palette an, die auf dem hochgeladenen Foto basiert, sondern auch vorgefertigte Farbschemata.

Diese Werkzeuge erzeugen ganze Farbpaletten.

6: Adobe Color CC Color Wheel

Dieses Tool war früher als Adobe Kuler bekannt und begann als grundlegende Farbvergleichsseite. Jetzt ist es ein Full-Power-Farbpalette Konstruktionssystem., Sie können Farbkombinationen basierend auf einer Farbkugel ausprobieren, vergleichen und speichern. Sie können Palettentypen auswählen und fünffarbige Paletten mit verschiedenen Eingabeebenen aus dem Tool generieren, einschließlich vollständig benutzerdefinierter und nahezu automatischer.

7: Paletton

Paletton können Sie erstellen eine Farbpalette schnell. Wählen Sie das gewünschte Schema aus: Mono, komplementär, triadisch, tetradisch, analog oder akzentuiert analog. Wenn Sie dann eine Farbe im Schema ändern, ändern sich die anderen entsprechend.,

8: Color Turm

Farbe Spire baut Sie eine Farbpalette aus einem einzigen Farbe. Sie wählen eine Startfarbe aus, und Color Spire schlägt eine Farbpalette vor, die Sie in Kombination damit verwenden können. Es bietet auch eine Vorschau, Mit der Sie sehen können, wie die empfohlenen Farben auf einer Beispielwebsite aussehen würden.

9: MudCube Color Sphere

(Source: )

MudCube ‚ s Color Sphere ist ein Chrome-Plugin, mit dem Sie Farben harmonisieren, die Farbenblindheit kontrollieren und Hex-Codes identifizieren können., Sie können Farbschemata auch direkt in Illustrator, PhotoShop und CoIRD.com.

10: Cohesive Colors

Cohesive Colors übernimmt Ihre aktuelle Palette und lässt Sie sie bearbeiten, indem Sie einen Overlay-Farbton in der Farbe Ihrer Wahl hinzufügen und schnell und einfach eine neue Palette aus einer vorhandenen Palette generieren.

11: Hex Color Scheme Generator

mit Diesem tool können Sie generieren, die Farben, die in Kombination mit einer Farbe, die Sie bereits haben. Es ist etwas grundlegender als einige der Farbkugelwerkzeuge in dieser Liste., Sie fügen eine Hex-Zahl in das Werkzeug ein oder klicken auf das Farbrad, und es wird mit einem Satz von 3 zusätzlichen Farben zurückgegeben, die mit Hex-Codes übereinstimmen.

Erstellen Sie Ihre Farben

Einige dieser Werkzeuge benötigen Sie eine Farbe im Auge zu haben, um zu beginnen. Wenn Sie kein Branding haben, das Sie anpassen müssen, und BrandColors Ihnen nichts gezeigt hat, was Ihnen auffiel, können Sie von vorne anfangen.,

12: Die Farb-App

Mit diesem iOS-Tool können Sie feine Entscheidungen zwischen ähnlichen Farben treffen, indem Sie sie klar mit etwas Abstand zwischen ihnen und nicht in Farbverläufen wie in Farbrädern und Kugeln auslegen. Mit großen Farbgittern können Sie Ihren gesamten Bildschirm verwenden (iPad Pro-Benutzer, freuen Sie sich!) außerdem können Sie Farben abtasten, RGB -, Hex-und HSLA-Werte finden und Farbpaletten von Grund auf neu erstellen.,

13: Farbe

Farbe, durch HailPixel, können sie wirklich nagel unten genau die farbe sie wollen, und dann gibt sie die Hex code für es.

Bewegen Sie den Mauszeiger über den Bildschirm und die Farbe ändert sich beim Bewegen sehr geringfügig – es ist wie eine Farbkugel, die ständig in Hex-Codes zurückfährt. Bewegen Sie sich über den Bildschirm für Farbe, nach oben und unten für Sättigung.

Holen Sie sich die Codes für eine Farbe

Wenn Sie irgendwo eine Farbe gesehen haben und nicht genau wissen, wie Sie sie nennen sollen, sind dies die Werkzeuge für Sie.,

14: SpyColor

SpyColor gibt Ihnen Informationen über jede Farbe, einschließlich der Hex -, RGB -, CMYK-und anderen codes. Das Tool zeigt Ihnen eine Reihe von Schematypen wie komplementär, Split-komplementär, triadisch, Clash und analog auf jeder Farbseite.

15: HTML-Farbcodes

HTML-Farbcodes finden Hex-Codes für Bildfarben in Ihrem Browser. Sie wählen ein Bild von Ihrem Desktop und klicken Sie auf „Bild anzeigen“, dann mit der Maus über sie Hex-Codes für die verschiedenen Teile des Bildes zu erhalten.,

Testen Sie Ihre Palette

Sobald Sie eine Farbpalette installiert haben, müssen Sie wissen, ob sie für eine Vielzahl von Besuchern funktioniert.

16: Überprüfen Sie meine Farben

Überprüfen Sie meine Farben Damit können Sie die Vorder-und Hintergrundfarben Ihrer Farbpalette überprüfen und sicherstellen, dass sie ausreichend Kontrast für jemanden mit Farbdefiziten bieten. Wenn Sie Ihre Website farbenblindheitssicher gestalten oder einfach nur die effektivsten und intuitivsten Farbkombinationen aus UX-Sicht erhalten möchten, ist dieses Tool von unschätzbarem Wert., Legen Sie eine URL ab und spuckt einen Bericht aus:

…der im Grunde den gesamten Code für Ihre Site durchläuft und bewertet alle visuellen Elemente darin auf Sichtbarkeit.

Passende Bilder

Jetzt ist Ihre Farbpalette vorhanden und Sie wissen, dass sie super sichtbar ist.

17: TinEye

TinEye ist besser als Alternative zur Google-Bildsuche bekannt., Aber es funktioniert auch als eine Möglichkeit, Farbkombinationen zu erkunden,mit einer Datenbank von über 10 Millionen Creative Commons Lizenz Fotos von Flickr geerntet. Wenn Sie nach Bildern in der perfekten Farbkombination suchen, ist dies eine großartige, einfach zu bedienende Möglichkeit, sie zu jagen.

18: Designspiration

Mit Designspiration können Sie bis zu fünf Farbtöne aus einer ganzseitigen Palette auswählen, sodass Sie die Farben klar sehen können. Anschließend zeigt die Site alle Bilder in ihrer Datenbank mit dieser Farbkombination an., Es zeigt Ihnen Hex-Zahlen deutlich, und können Sie auf einzelne Hex-Zahlen klicken. Sie können Bilder in Sammlungen auf der Website speichern und herunterladen.

So verwenden Sie ein Website-Verhaltens-Tool, um die besten Farbpaletten zu analysieren

Sie könnten denken, dass Sie nur eine Website-Farbpalette auswählen und mit Volldampf vorankommen müssen. Das ist nicht der beste Weg, um Geschäfte zu machen.

Denken Sie darüber nach. Sie testen Ihre CTAs, Schlagzeilen und andere Website-Elemente. Warum sollte Farbe anders sein?,

Ein Website-Verhaltensanalyse-Tool wie Crazy Egg bietet die perfekte Gelegenheit, um herauszufinden, wie Ihr Publikum auf Ihre aktuelle Farbpalette reagiert.

das Nutzerverhalten Berichte wie heatmaps werden Ihnen sagen, ob Ihre Farben fangen die Augen der Menschen, die Ihnen wichtig — Ihre aktuellen und potenziellen Kunden.

Wenn Sie Rohdaten in Ihren Händen haben, können Sie fundierte Entscheidungen über Ihre Website-Farbpalette treffen.,

Stellen Sie sich vor, Sie haben eine Website für ein Publikum von Sportliebhabern erstellt und die Farben Blau und Rosa sowie ein paar neutrale Grautöne ausgewählt. Dein Publikum mag es nicht.

Vielleicht vermittelt es Ihr Bild nicht gut genug. Sportliebhaber mögen vielleicht mutigere, dunklere Farben und erdige Töne.

Sie werden es erst wissen, wenn Sie testen.

Starten Sie Crazy Egg

Erstellen Sie ein kostenloses Crazy Egg-Konto, um Ihre kostenlose Testversion zu starten, oder melden Sie sich an, um Ihre Benutzerverhaltensberichte einzurichten.

Sie können mehrere Tests gleichzeitig ausführen, sodass Sie keine Stunden, Tage oder Wochen verschwenden., Stattdessen können Sie Daten in Echtzeit erfassen und Ihre Bemühungen darauf konzentrieren, die bestmögliche Farbpalette zu finden.

Fazit

Ihre Website-Farbpalette sollte nicht nur Ihre Marke widerspiegeln, sondern auch Ihr Publikum ansprechen. Andernfalls, Menschen könnten von Ihrer Website ausgeschaltet werden, ohne es zu merken.

Beginne mit dem, was dir gefällt. Erwägen Sie die Auswahl einer Palette, die sich von anderen in Ihrer Nische unterscheidet, damit Sie auffallen. Dann beginnen Sie mit dem Testen.

Es ist einfach, die Farben auf Ihrer Website zu ändern. Wenn Sie HTML kennen, können Sie die HEX-Codes in Ihren Designdateien manuell ändern., Viele WordPress-Themes verfügen auch über Customizer, mit denen Sie Farben ändern können, ohne Code zu kennen.

Geben Sie sich die Möglichkeit, Ihre Website so optisch ansprechend und unvergesslich wie möglich zu gestalten.