Web Components Design System for Open UI
- Component Frame White#f9fafb
- State Flow Teal#00c2a8
- Atomic Indigo#6a63ff
- Reusable Gray#d1d5db
- Slot Highlight Pink#f48fb1
- Variant Yellow#fce77d
Utworzono 07/17/2025 08:24
Paleta składa się z kolorów Jasny. Kolory akcentujące State Flow Teal #00c2a8 i Variant Yellow #fce77d. Paleta ma temperaturę kolorów Neutralny, Zimny, Ciepły.
Według jasności paleta rozciąga się od #6A63FF (najciemniejszy) do #F9FAFB (najjaśniejszy). Zakres jasności jest umiarkowany.
Nasycenie wydaje się żywe (wysoka chroma) — 67% kolorów jest żywych.
Niektóre kolory leżą niemal naprzeciw siebie na kole barw, co daje palecie kontrast dopełniający.
Ogólna temperatura barw przechyla się ku zimnu (3 z 6).
Kody HEX (posortowane): #00C2A8, #6A63FF, #D1D5DB, #F48FB1, #F9FAFB, #FCE77D
Paleta Web Components Design System for Open UI łączy 6 kodów kolorów:
HEX: #f9fafb, RGB: (249, 250, 251); HEX: #00c2a8, RGB: (0, 194, 168); HEX: #6a63ff, RGB: (106, 99, 255)
HEX: #d1d5db, RGB: (209, 213, 219); HEX: #f48fb1, RGB: (244, 143, 177); HEX: #fce77d, RGB: (252, 231, 125)
Uproszczona wersja palety kolorów
Jasny odcień Biały dym, Ciemny odcień Średnia akwamaryna, Ciemny odcień Średni łupkowy niebieski, Jasny odcień Jasnoszary, Jasny odcień Blady fioletowoczerwony, Jasny odcień Khaki
Schemat kolorów został stworzony przez hex
Kody kolorów w palecie
Web Components Design System for Open UI kody kolorów HEX, informacje RGB w tabeli
| Kolor | HEX | RGB | Nazwa | Alternatywna nazwa |
|---|---|---|---|---|
| #f9fafb | #f9fafb | RGB(249, 250, 251) | Component Frame White | — |
| #00c2a8 | #00c2a8 | RGB(0, 194, 168) | State Flow Teal | — |
| #6a63ff | #6a63ff | RGB(106, 99, 255) | Atomic Indigo | — |
| #d1d5db | #d1d5db | RGB(209, 213, 219) | Reusable Gray | — |
| #f48fb1 | #f48fb1 | RGB(244, 143, 177) | Slot Highlight Pink | — |
| #fce77d | #fce77d | RGB(252, 231, 125) | Variant Yellow | — |
Kontrast palety kolorów
10 pary kolorów mają niski kontrast i wymagają poprawy, co może wpłynąć na czytelność.
| Kolor tekstu | Kolor tła | Współczynnik kontrastu |
|---|---|---|
#f9fafb | #d1d5db | 1.41 |
#f9fafb | #fce77d | 1.19 |
#00c2a8 | #6a63ff | 1.91 |
#00c2a8 | #d1d5db | 1.53 |
#00c2a8 | #f48fb1 | 1.01 |
#00c2a8 | #fce77d | 1.81 |
Paleta obrazów Web Components Design System for Open UI png
Eksportuj paletę
Pobierz "Web Components Design System for Open UI" w różnych formatach, aby bezproblemowo zintegrować ją z projektami graficznymi.
Dostępne formaty: