mittwald Flow Logo

Components

Color

Mit der Color-Component lassen sich gezielt Textstellen farbig hervorheben – etwa für Werbemaßnahmen.GitHub
Veröffentliche eigene Features im mStudio

Playground

Die Color-Component färbt Text, indem <Color /> mit der passenden color-Property um Teile von Text oder Headings gelegt wird. Sie kommt nur in Ausnahmefällen, beispielsweise bei Werbemaßnahmen, zum Einsatz.

Veröffentliche eigene Features im mStudio
import {
  Color,
  Text,
} from "@mittwald/flow-react-components";

<Text>
  <b>
    Veröffentliche{" "}
    <Color color="violet">eigene Features</Color> im mStudio
  </b>
</Text>

Color

Folgende color-Properties stehen bei der Color-Component zur Auswahl: Blue, Violett, Lilac und Teal. Dabei ist stets darauf zu achten, dass der Kontrast zwischen Schrift und Hintergrund ausreichend hoch ist.

bluevioletlilacteal

Kombiniere mit ...

Text

Teile eines Textes lassen sich mithilfe der Color-Component einfärben.

Veröffentliche eigene Features im mStudio

Heading

Mit der Color-Component lassen sich in Headings gezielt wichtige Wörter farblich hervorheben.

mStudio Extension selber entwickeln

AccentBox

Ein häufiges Einsatzgebiet der Color-Component ist die Hervorhebung von Headings in AccentBoxen mit Werbeinhalten. Dabei ist besonders wichtig, dass die eingefärbte Schrift einen ausreichenden Kontrast zum Hintergrund aufweist.

mStudio Extension selber entwickeln

Veröffentliche eigene Features im mStudio
Contributor Landingpage

Overview