Moodboard, Farben und Schriften: Wie du den Look deiner Website entwickelst

Bevor du eine einzige Seite baust, lohnt es sich, ein Gefühl für den visuellen Stil deiner Website zu entwickeln. Das klingt nach einem optionalen Extra – ist aber einer der unterschätztesten Schritte im Website-Prozess. Denn wenn du weißt, wie dein Auftritt wirken soll, werden alle anderen Entscheidungen leichter.

Was ein Moodboard ist – und warum es hilft

Ein Moodboard ist eine visuelle Sammlung von Elementen, die zusammen die Stimmung deiner Marke zeigen. Fotos, Farben, Typografie, andere Websites, Texturausschnitte – alles, was das Gefühl vermittelt, das du mit deiner Marke auslösen möchtest.

Es geht nicht darum, etwas zu kopieren. Es geht darum, eine gemeinsame visuelle Sprache zu entwickeln – für dich, damit du Klarheit hast, und für alle, die dir dabei helfen.

Ein Moodboard hilft dir dabei:

• Visuellen Geschmack in konkrete Entscheidungen zu übersetzen
• Konsistenz zu schaffen, bevor du mit dem Aufbau beginnst
• Inspiration zu sammeln, ohne dich festzulegen

Wo du Inspiration findest

Pinterest ist nach wie vor eine der besten Quellen für visuelle Inspiration. Erstelle ein Board mit dem Thema deiner Marke und pin alles, was dich anspricht – ohne zu filtern. Nach zehn bis zwanzig Pins erkennst du Muster: Welche Farben wiederholen sich? Welcher Stil zieht sich durch?

Behance und Dribbble zeigen professionelle Design-Arbeiten – gut für Inspiration zu Typografie und Layouts.

Andere Websites deiner Branche – aber Achtung: Hier geht es nicht darum, etwas zu übernehmen, sondern zu verstehen, was in deiner Branche der Standard ist und wie du dich davon abheben kannst.

KI-Bildgeneratoren wie Midjourney kannst du für Stimmungsbilder nutzen: “Moodboard für eine minimalistische Wellness-Marke, helle Töne, natürliche Texturen, warm und einladend” – das gibt dir visuelle Richtungen in Sekunden.

Die richtigen Farben finden

Farben transportieren Emotionen – und die sind kulturell geprägt. Ein paar grobe Orientierungen:

• Blautöne – Vertrauen, Professionalität, Stabilität
• Grüntöne – Natur, Gesundheit, Frische
• Rottöne – Energie, Leidenschaft, Dringlichkeit
• Gelb/Orange – Wärme, Optimismus, Kreativität
• Lila/Violett – Kreativität, Spiritualität, Luxus
• Neutrale Töne – Eleganz, Zeitlosigkeit, Seriosität

Das sind keine fixen Regeln – aber sie helfen bei der Orientierung.

Für deine Farbauswahl: Nutze Tools wie Coolors.co oder Adobe Color für fertige Paletten. Oder bitte die KI:

„Ich bin Businesscoach für Frauen in der Karriereentwicklung. Mein Stil ist modern, selbstbewusst und freundlich. Schlage mir eine Farbpalette mit Hex-Codes vor, die zu dieser Positionierung passt.”

Wichtig: Teste deine Farben auf Kontrast. Nicht jede schöne Kombination ist auch gut lesbar – besonders Text auf farbigem Hintergrund. Ein Tool wie Contrast Checker (webaim.org) hilft dabei.

Die richtigen Schriften finden

Schriften prägen das Gefühl deiner Website massiv – oft unbewusst. Grob unterscheidet man:

Serif-Schriften (mit Serifen, also kleinen Querstrichen) wirken klassisch, seriös, vertrauenswürdig. Gut für Kanzleien, Beratungen, Luxus-Marken.

Sans-Serif-Schriften (ohne Serifen) wirken modern, klar, zugänglich. Ideal für die meisten digitalen Angebote.

Display-Schriften (dekorative Schriften) sind für große Überschriften geeignet, aber nie für Fließtext.

Für den Start: Zwei Schriften reichen. Eine für Überschriften, eine für alles andere. Google Fonts bietet hunderte kostenlose Optionen – und du kannst dir von ChatGPT Kombinationen empfehlen lassen:

„Ich brauche eine Schriftkombination für eine moderne, warme Website. Beide Schriften sollen kostenlos von Google Fonts sein. Eine für Headlines, eine für Fließtext.”

Das Moodboard zusammenstellen

Tools dafür:

• Canva – Einfach, schnell, kostenlos. Erstelle ein neues Design im Querformat und ziehe deine Elemente rein.
• Milanote – Speziell für Moodboards und Kreativprojekte entwickelt
• Figma – Für alle, die ohnehin damit arbeiten wollen

Ein gutes Moodboard für eine Website enthält:

• 3–5 Bilder, die die Stimmung zeigen
• Deine Farbpalette mit Hex-Codes
• Deine zwei gewählten Schriften mit Beispieltexten
• Dein Logo (wenn schon vorhanden)
• Optional: Website-Inspirationen (Screenshots)

Wann du bereit bist weiterzumachen

Du weißt, dass dein Moodboard funktioniert, wenn:

• Es dich bei jedem Ansehen bestätigt: “Ja, das bin ich”
• Eine Vertrauensperson sofort versteht, welches Gefühl du vermitteln willst
• Die Elemente konsistent wirken – also zusammenpassen

Dann ist es Zeit, von der Inspiration in die Umsetzung zu gehen.

Du möchtest diesen Look auf deiner eigenen Website umsetzen – Schritt für Schritt, ohne Design-Vorwissen? Im kostenlosen Video zeige ich wie du mit KI zu einem Profi Ergebnis kommst Jetzt kostenloses Training ansehen