# Color

Mit der Color-Component lassen sich Texte, Headings oder Icons gezielt einfärben, um sie sichtbar vom übrigen Designsystem abzuheben.

## Guidelines

# Grundlagen

## Best practices

Achte bei der Verwendung der Color-Component darauf, dass ...

- sie sparsam und nur in Ausnahmefällen eingesetzt wird.
- die eingefärbte Schrift stets einen ausreichenden Kontrast zum Hintergrund
  aufweist.
- nur kurze Abschnitte (1-3 Wörter) in
  [Texten](/04-components/content/text/overview) oder
  [Headings](/04-components/content/heading/overview) hervorgehoben werden. Die
  markierten Wörter sollten den Inhalt bzw. die Aussage gezielt betonen.

## Verwendung

Verwende die Color-Component, um ...

- besondere Wörter in [Heading](/04-components/content/heading/overview)
  innerhalb von
  Werbe-[AccentBoxen](/04-components/structure/accent-box/overview) farblich
  hervorzuheben.
- einzelne Begriffe in Headings oder
  [Texten](/04-components/content/text/overview) auf Landing-Pages gezielt zu
  betonen.
- [Icons](/04-components/content/icon/overview) für Trendindikatoren auf
  Dashboards einzufärben.