Hergestellt in 07/16/2025 11:49
UX-Optimized UI Kit for React
- Component Cream#f5f5f5
- Focus Indigo#3d348b
- CTA Red#e63946
- Background Sand#fff8e1
- Text Gray#4a4a4a
- Surface Green#a8dadc
Die Palette besteht aus Licht, Halbdunkel-Farben. Akzentfarben Focus Indigo #3d348b und Background Sand #fff8e1. Palette hat Farbtemperatur Neutral, Kalt, Warm.
Nach Helligkeit reicht diese Palette von #4A4A4A (dunkelstes) bis #F5F5F5 (hellstes). Die Helligkeitsspanne ist groß.
Die Sättigung ist gemischt — gedämpfte und lebhafte Farbfelder.
Manche Farbton-Paare liegen nahe Komplementärpositionen — kann wie Komplementärkontrast wirken (heuristisch).
In der Gesamttemperatur neigen die Felder zur kalten Seite.
HEX-Codes (sortiert): #3D348B, #4A4A4A, #A8DADC, #E63946, #F5F5F5, #FFF8E1
Die Palette UX-Optimized UI Kit for React enthält eine Kombination aus 6-Codefarben:
VERHEXEN: #f5f5f5, RGB: (245, 245, 245); VERHEXEN: #3d348b, RGB: (61, 52, 139); VERHEXEN: #e63946, RGB: (230, 57, 70)
VERHEXEN: #fff8e1, RGB: (255, 248, 225); VERHEXEN: #4a4a4a, RGB: (74, 74, 74); VERHEXEN: #a8dadc, RGB: (168, 218, 220)
Vereinfachte Version der Palettenfarben
Farbton von darkslateblue, Schatten von crimson, Schatten von cornsilk, Farbton von dimgrey, Farbton von powderblue
Farbschema wurde erstellt von hex
Farbcodes in der Palette
UX-Optimized UI Kit for React Farbcodes HEX, RGB-Informationen in der Tabelle
| Farbe | VERHEXEN | RGB | Name | alternativer Name |
| #f5f5f5 | #f5f5f5 | RGB(245, 245, 245) | Component Cream | White Smoke |
| #3d348b | #3d348b | RGB(61, 52, 139) | Focus Indigo | — |
| #e63946 | #e63946 | RGB(230, 57, 70) | CTA Red | — |
| #fff8e1 | #fff8e1 | RGB(255, 248, 225) | Background Sand | Still Morning |
| #4a4a4a | #4a4a4a | RGB(74, 74, 74) | Text Gray | Gray29 |
| #a8dadc | #a8dadc | RGB(168, 218, 220) | Surface Green | — |
Farbpalette Kontrast
4 Farbpaare haben einen niedrigen Kontrast und müssen verbessert werden, was die Lesbarkeit beeinträchtigen kann.
| Tekst kleur | Achtergrond kleur | contrast ratio |
#f5f5f5 | #fff8e1 | 1.02 |
#f5f5f5 | #a8dadc | 1.4 |
#3d348b | #4a4a4a | 1.14 |
#fff8e1 | #a8dadc | 1.43 |
Bildpalette UX-Optimized UI Kit for React png
Palette exportieren
Laden Sie die "UX-Optimized UI Kit for React" in mehreren Formaten herunter, um sie nahtlos in Ihre Designprojekte zu integrieren.
Verfügbare Formate: