Google Farbpalette

Über diese Palette

The Google Palette is inspired by recognisable brand-style colour systems. It is useful for mood boards, visual research, comparison work and creative direction when you want to understand how strong brand colours work together.

The key colours in this Palette are #4285F4, #DB4437, #F4B400, #0F9D58. Verwenden them as reference values for design exploration, not as official brand guidelines.

You can also explore related unternehmens- und markenPaletten, open the Palette in the colour tool, or compare it with articles that use similar colour ideas.

Farben in dieser Palette

Click any colour to copy the HEX value, or open the full Palette in the colour tool to test harmonies, contrast and CSS export options.

So verwenden Sie diese Palette

• Basis: Nutzen Sie den ruhigsten oder hellsten Ton als Grundlage und lassen Sie kräftigere Farben gezielt Persönlichkeit hinzufügen.
• Kontrast: Kombinieren Sie immer einen hellen und einen dunklen Ton, bevor die Palette für Text, Buttons oder wichtige Informationen eingesetzt wird.
• Akzente: Setzen Sie die lebendigste Farbe nur auf kleinen Flächen ein, damit sie Aufmerksamkeit lenkt, ohne alles zu dominieren.
• Kontext: Testen Sie Farben auf echten Materialien, im tatsächlichen Licht oder auf den später genutzten Bildschirmen.
• Konsistenz: Geben Sie jeder Farbe eine feste Aufgabe und wiederholen Sie diese Rollen über Seiten, Räume oder Medien hinweg.

CSS-Farbvariablen

Kopieren these variables into your stylesheet or design system.

:root {
  --Palette-colour-1: #4285F4;
  --Palette-colour-2: #DB4437;
  --Palette-colour-3: #F4B400;
  --Palette-colour-4: #0F9D58;
}