Token'lar

Tema üreticisi

Marka renklerinden doğrulanmış bir aday marka paketi dosyası üreten, yalnızca bu sitede çalışan araç.

Tema üreticisi marka, vurgu ve isteğe bağlı nötr ve durum renklerinden bir aday marka paketi üretir, kontrastı derlemedeki brand:validate koduyla anında denetler ve sonucu gerçek BigBang bileşenleri, bir grafik örneği ve illüstrasyon yuvaları üzerinde açık ve koyu modda gösterir.

Araç yalnızca bu sitede çalışır. Ürünler onu hiçbir zaman yüklemez; ürün ekranları markayı yine derleme sırasında üretilen sabit CSS dosyalarından alır. Çıktılar imzasız aday dosyalardır (unsigned-candidate): burada geçmek gereklidir ama yeterli değildir, paket hattı dosyayı yeniden doğrular, inceler ve imzalar.

Girdiler

Marka rengi

#RRGGBB veya oklch(L C H). Basamak açıklıkları sabittir; ton ve doygunluk bu renkten gelir.

Vurgu rengi

#RRGGBB veya oklch(L C H). Basamak açıklıkları sabittir; ton ve doygunluk bu renkten gelir.

Nötr tonNötrleri renklendir

Durum renkleri

Yalnızca işaretlenen roller pakete rampa ekler; diğerleri DS varsayılanıdır.

Tehlike (red)

Başarı (green)

Uyarı (orange)

Bilgi (blue)

Biçim ve yazı

Birincil renk

Köşe yuvarlaklığı

Yazı tipi (lisanslı liste)

Logo (yalnız önizleme)

Dosya tarayıcıda kalır; hiçbir dışa aktarıma veya bağlantıya girmez.

Rampalar

brand

brand.600 L#4F55B4

accent

accent.600 L#954923

Açıklık değişiklikleri (kayıtlı)

Değişiklik yok.

Koyu mod istisnaları (0/8)

İstisna yok.

Önizleme

Açık

NötrMarkaBilgiBaşarıUyarıTehlike

Alan etiketi

Örnek açıklama metni

Alan etiketi

Örnek hata metni

Örnek yüzey

Gövde metni, ikincil metin ve bir bağlantı.

Koyu

NötrMarkaBilgiBaşarıUyarıTehlike

Alan etiketi

Örnek açıklama metni

Alan etiketi

Örnek hata metni

Örnek yüzey

Gövde metni, ikincil metin ve bir bağlantı.

Kontroller

Tüm engelleyen kontroller geçti. 0 engelleyen sorun, 0 uyarı

Kontrast matrisi (351)

WCAG 2.x oranı, yuvarlanmadan: metin ≥ 4,5:1, kenar ve durum göstergesi ≥ 3:1.
Mod	Çift	Oran	Eşik	Sonuç
Açık	`text-default` / `surface-default`	16.734	4.5	✓ Geçti
Açık	`text-default` / `surface-layer-2`	15.313	4.5	✓ Geçti
Açık	`text-subtle` / `surface-default`	9.678	4.5	✓ Geçti
Açık	`text-default` / `surface-sunken`	16.444	4.5	✓ Geçti
Açık	`text-subtle` / `surface-sunken`	9.510	4.5	✓ Geçti
Açık	`text-default` / `surface-checker`	17.176	4.5	✓ Geçti
Açık	`text-subtlest` / `surface-checker`	7.486	4.5	✓ Geçti
Açık	`text-subtlest` / `surface-default`	7.293	4.5	✓ Geçti
Açık	`text-subtlest` / `surface-raised`	7.813	4.5	✓ Geçti
Açık	`text-placeholder` / `surface-raised`	4.741	4.5	✓ Geçti
Açık	`text-link` / `surface-default`	16.734	4.5	✓ Geçti
Açık	`text-danger` / `surface-raised`	6.456	4.5	✓ Geçti
Açık	`text-success` / `surface-raised`	5.685	4.5	✓ Geçti
Açık	`text-warning` / `surface-raised`	6.155	4.5	✓ Geçti
Açık	`text-info` / `surface-raised`	5.960	4.5	✓ Geçti
Açık	`text-on-brand` / `surface-brand`	17.176	4.5	✓ Geçti
Açık	`text-inverse` / `surface-inverse`	17.927	4.5	✓ Geçti
Açık	`action-on-primary-default` / `action-primary-default`	17.176	4.5	✓ Geçti
Açık	`action-on-primary-default` / `action-primary-hovered`	14.498	4.5	✓ Geçti
Açık	`action-on-secondary-default` / `action-secondary-default`	17.927	4.5	✓ Geçti
Açık	`action-on-danger-default` / `action-danger-default`	6.456	4.5	✓ Geçti
Açık	`action-on-danger-subtle-default` / `action-secondary-default`	6.456	4.5	✓ Geçti
Açık	`action-on-danger-subtle-default` / `surface-default`	6.027	4.5	✓ Geçti
Açık	`action-on-danger-subtle-default` / `action-danger-subtle-hovered`	5.991	4.5	✓ Geçti
Açık	`action-on-danger-subtle-default` / `action-danger-subtle-pressed`	5.518	4.5	✓ Geçti
Açık	`data-positive` / `surface-raised`	5.685	4.5	✓ Geçti
Açık	`data-negative` / `surface-raised`	6.456	4.5	✓ Geçti
Açık	`status-neutral-foreground` / `status-neutral-background`	9.510	4.5	✓ Geçti
Açık	`status-neutral-on-emphasis` / `status-neutral-emphasis`	4.741	4.5	✓ Geçti
Açık	`status-brand-foreground` / `status-brand-background`	7.792	4.5	✓ Geçti
Açık	`status-brand-on-emphasis` / `status-brand-emphasis`	6.381	4.5	✓ Geçti
Açık	`status-info-foreground` / `status-info-background`	7.289	4.5	✓ Geçti
Açık	`status-info-on-emphasis` / `status-info-emphasis`	4.997	4.5	✓ Geçti
Açık	`status-success-foreground` / `status-success-background`	7.091	4.5	✓ Geçti
Açık	`status-success-on-emphasis` / `status-success-emphasis`	5.073	4.5	✓ Geçti
Açık	`status-warning-foreground` / `status-warning-background`	7.414	4.5	✓ Geçti
Açık	`status-warning-on-emphasis` / `status-warning-emphasis`	4.852	4.5	✓ Geçti
Açık	`status-danger-foreground` / `status-danger-background`	7.689	4.5	✓ Geçti
Açık	`status-danger-on-emphasis` / `status-danger-emphasis`	4.677	4.5	✓ Geçti
Açık	`text-subtle` / `status-info-background`	8.999	4.5	✓ Geçti
Açık	`text-subtle` / `status-success-background`	9.094	4.5	✓ Geçti
Açık	`text-subtle` / `status-warning-background`	8.934	4.5	✓ Geçti
Açık	`text-subtle` / `status-danger-background`	8.861	4.5	✓ Geçti
Açık	`status-neutral-foreground` / `surface-raised`	10.368	4.5	✓ Geçti
Açık	`status-brand-foreground` / `surface-raised`	8.626	4.5	✓ Geçti
Açık	`status-info-foreground` / `surface-raised`	8.397	4.5	✓ Geçti
Açık	`status-success-foreground` / `surface-raised`	8.084	4.5	✓ Geçti
Açık	`status-warning-foreground` / `surface-raised`	8.604	4.5	✓ Geçti
Açık	`status-danger-foreground` / `surface-raised`	8.996	4.5	✓ Geçti
Açık	`tag-red-foreground` / `tag-red-background`	7.689	4.5	✓ Geçti
Açık	`tag-orange-foreground` / `tag-orange-background`	7.414	4.5	✓ Geçti
Açık	`tag-green-foreground` / `tag-green-background`	7.091	4.5	✓ Geçti
Açık	`tag-blue-foreground` / `tag-blue-background`	7.289	4.5	✓ Geçti
Açık	`tag-violet-foreground` / `tag-violet-background`	7.576	4.5	✓ Geçti
Açık	`tag-teal-foreground` / `tag-teal-background`	7.172	4.5	✓ Geçti
Açık	`tag-pink-foreground` / `tag-pink-background`	7.673	4.5	✓ Geçti
Açık	`status-neutral-foreground` / `surface-default`	9.678	4.5	✓ Geçti
Açık	`status-brand-foreground` / `surface-default`	8.052	4.5	✓ Geçti
Açık	`status-info-foreground` / `surface-default`	7.838	4.5	✓ Geçti
Açık	`status-success-foreground` / `surface-default`	7.546	4.5	✓ Geçti
Açık	`status-warning-foreground` / `surface-default`	8.032	4.5	✓ Geçti
Açık	`status-danger-foreground` / `surface-default`	8.397	4.5	✓ Geçti
Açık	`tag-violet-foreground` / `surface-default`	8.251	4.5	✓ Geçti
Açık	`tag-teal-foreground` / `surface-default`	7.647	4.5	✓ Geçti
Açık	`tag-pink-foreground` / `surface-default`	8.378	4.5	✓ Geçti
Açık	`text-default` / `surface-layer-1`	16.444	4.5	✓ Geçti
Açık	`text-subtle` / `surface-layer-1`	9.510	4.5	✓ Geçti
Açık	`border-input` / `surface-raised`	3.362	3	✓ Geçti
Açık	`border-focus` / `surface-default`	16.734	3	✓ Geçti
Açık	`focus-ring` / `surface-raised`	4.741	3	✓ Geçti
Açık	`icon-default` / `surface-default`	14.126	3	✓ Geçti
Açık	`icon-subtle` / `surface-raised`	4.741	3	✓ Geçti
Açık	`icon-danger` / `surface-raised`	5.046	3	✓ Geçti
Açık	`icon-success` / `surface-raised`	4.394	3	✓ Geçti
Açık	`icon-warning` / `surface-raised`	4.755	3	✓ Geçti
Açık	`icon-info` / `surface-raised`	4.611	3	✓ Geçti
Açık	`action-primary-default` / `surface-default`	16.734	3	✓ Geçti
Açık	`border-danger` / `action-secondary-default`	5.046	3	✓ Geçti
Açık	`illustration-ink` / `surface-default`	14.126	3	✓ Geçti
Açık	`illustration-ink` / `illustration-surface`	15.133	3	✓ Geçti
Açık	`illustration-ink` / `illustration-neutral-1`	13.881	3	✓ Geçti
Açık	`illustration-ink` / `illustration-primary-soft`	11.493	3	✓ Geçti
Açık	`illustration-success` / `surface-default`	4.101	3	✓ Geçti
Açık	`illustration-warning` / `surface-default`	4.438	3	✓ Geçti
Açık	`illustration-danger` / `surface-default`	4.710	3	✓ Geçti
Açık	`chart-categorical-1` / `surface-raised`	5.960	3	✓ Geçti
Açık	`chart-categorical-2` / `surface-raised`	3.261	3	✓ Geçti
Açık	`chart-categorical-3` / `surface-raised`	6.155	3	✓ Geçti
Açık	`chart-categorical-4` / `surface-raised`	3.546	3	✓ Geçti
Açık	`chart-categorical-5` / `surface-raised`	5.047	3	✓ Geçti
Açık	`chart-categorical-6` / `surface-raised`	4.394	3	✓ Geçti
Açık	`chart-categorical-7` / `surface-raised`	3.632	3	✓ Geçti
Açık	`chart-categorical-8` / `surface-raised`	7.813	3	✓ Geçti
Açık	`status-neutral-emphasis` / `surface-raised`	4.741	3	✓ Geçti
Açık	`status-neutral-emphasis` / `surface-default`	4.426	3	✓ Geçti
Açık	`status-brand-emphasis` / `surface-raised`	6.381	3	✓ Geçti
Açık	`status-brand-emphasis` / `surface-default`	5.956	3	✓ Geçti
Açık	`status-info-emphasis` / `surface-raised`	3.325	3	✓ Geçti
Açık	`status-info-emphasis` / `surface-default`	3.104	3	✓ Geçti
Açık	`status-success-emphasis` / `surface-raised`	3.248	3	✓ Geçti
Açık	`status-success-emphasis` / `surface-default`	3.032	3	✓ Geçti
Açık	`status-warning-emphasis` / `surface-raised`	3.470	3	✓ Geçti
Açık	`status-warning-emphasis` / `surface-default`	3.239	3	✓ Geçti
Açık	`status-danger-emphasis` / `surface-raised`	3.632	3	✓ Geçti
Açık	`status-danger-emphasis` / `surface-default`	3.390	3	✓ Geçti
Açık	`chart-categorical-1` / `surface-default`	5.563	3	✓ Geçti
Açık	`chart-categorical-2` / `surface-default`	3.044	3	✓ Geçti
Açık	`chart-categorical-3` / `surface-default`	5.745	3	✓ Geçti
Açık	`chart-categorical-4` / `surface-default`	3.310	3	✓ Geçti
Açık	`chart-categorical-5` / `surface-default`	4.711	3	✓ Geçti
Açık	`chart-categorical-6` / `surface-default`	4.101	3	✓ Geçti
Açık	`chart-categorical-7` / `surface-default`	3.390	3	✓ Geçti
Açık	`chart-categorical-8` / `surface-default`	7.293	3	✓ Geçti
Açık	`text-default` / `surface-translucent over surface-default`	17.324	4.5	✓ Geçti
Açık	`text-default` / `surface-translucent over surface-sunken`	17.324	4.5	✓ Geçti
Açık	`text-default` / `surface-translucent over surface-raised`	17.474	4.5	✓ Geçti
Açık	`text-default` / `material-glass-regular over #FFFFFF`	17.927	4.5	✓ Geçti
Açık	`text-default` / `material-glass-regular over #000000`	11.163	4.5	✓ Geçti
Açık	`text-default` / `material-glass-regular over #808080`	14.497	4.5	✓ Geçti
Açık	`text-default` / `material-glass-regular over #0000FF`	11.651	4.5	✓ Geçti
Açık	`text-default` / `material-glass-regular over #FFFF00`	17.439	4.5	✓ Geçti
Açık	`text-default` / `material-glass-regular over #FF0000`	12.601	4.5	✓ Geçti
Açık	`text-default` / `material-glass-regular over #00FF00`	16.001	4.5	✓ Geçti
Açık	`text-subtle` / `material-glass-regular over #FFFFFF`	10.368	4.5	✓ Geçti
Açık	`text-subtle` / `material-glass-regular over #000000`	6.456	4.5	✓ Geçti
Açık	`text-subtle` / `material-glass-regular over #808080`	8.384	4.5	✓ Geçti
Açık	`text-subtle` / `material-glass-regular over #0000FF`	6.738	4.5	✓ Geçti
Açık	`text-subtle` / `material-glass-regular over #FFFF00`	10.085	4.5	✓ Geçti
Açık	`text-subtle` / `material-glass-regular over #FF0000`	7.288	4.5	✓ Geçti
Açık	`text-subtle` / `material-glass-regular over #00FF00`	9.254	4.5	✓ Geçti
Açık	`text-subtlest` / `material-glass-regular over #FFFFFF`	7.813	4.5	✓ Geçti
Açık	`text-subtlest` / `material-glass-regular over #000000`	4.865	4.5	✓ Geçti
Açık	`text-subtlest` / `material-glass-regular over #808080`	6.318	4.5	✓ Geçti
Açık	`text-subtlest` / `material-glass-regular over #0000FF`	5.078	4.5	✓ Geçti
Açık	`text-subtlest` / `material-glass-regular over #FFFF00`	7.601	4.5	✓ Geçti
Açık	`text-subtlest` / `material-glass-regular over #FF0000`	5.492	4.5	✓ Geçti
Açık	`text-subtlest` / `material-glass-regular over #00FF00`	6.974	4.5	✓ Geçti
Açık	`icon-default` / `material-glass-regular over #FFFFFF`	15.133	3	✓ Geçti
Açık	`icon-default` / `material-glass-regular over #000000`	9.423	3	✓ Geçti
Açık	`icon-default` / `material-glass-regular over #808080`	12.238	3	✓ Geçti
Açık	`icon-default` / `material-glass-regular over #0000FF`	9.835	3	✓ Geçti
Açık	`icon-default` / `material-glass-regular over #FFFF00`	14.721	3	✓ Geçti
Açık	`icon-default` / `material-glass-regular over #FF0000`	10.637	3	✓ Geçti
Açık	`icon-default` / `material-glass-regular over #00FF00`	13.507	3	✓ Geçti
Açık	`text-default` / `material-glass-regular-contrast over #FFFFFF`	17.927	4.5	✓ Geçti
Açık	`text-default` / `material-glass-regular-contrast over #000000`	15.038	4.5	✓ Geçti
Açık	`text-default` / `material-glass-regular-contrast over #808080`	16.444	4.5	✓ Geçti
Açık	`text-default` / `material-glass-regular-contrast over #0000FF`	15.247	4.5	✓ Geçti
Açık	`text-default` / `material-glass-regular-contrast over #FFFF00`	17.719	4.5	✓ Geçti
Açık	`text-default` / `material-glass-regular-contrast over #FF0000`	15.652	4.5	✓ Geçti
Açık	`text-default` / `material-glass-regular-contrast over #00FF00`	17.104	4.5	✓ Geçti
Açık	`text-subtle` / `material-glass-regular-contrast over #FFFFFF`	10.368	4.5	✓ Geçti
Açık	`text-subtle` / `material-glass-regular-contrast over #000000`	8.697	4.5	✓ Geçti
Açık	`text-subtle` / `material-glass-regular-contrast over #808080`	9.510	4.5	✓ Geçti
Açık	`text-subtle` / `material-glass-regular-contrast over #0000FF`	8.817	4.5	✓ Geçti
Açık	`text-subtle` / `material-glass-regular-contrast over #FFFF00`	10.247	4.5	✓ Geçti
Açık	`text-subtle` / `material-glass-regular-contrast over #FF0000`	9.052	4.5	✓ Geçti
Açık	`text-subtle` / `material-glass-regular-contrast over #00FF00`	9.892	4.5	✓ Geçti
Açık	`text-subtlest` / `material-glass-regular-contrast over #FFFFFF`	7.813	4.5	✓ Geçti
Açık	`text-subtlest` / `material-glass-regular-contrast over #000000`	6.554	4.5	✓ Geçti
Açık	`text-subtlest` / `material-glass-regular-contrast over #808080`	7.167	4.5	✓ Geçti
Açık	`text-subtlest` / `material-glass-regular-contrast over #0000FF`	6.645	4.5	✓ Geçti
Açık	`text-subtlest` / `material-glass-regular-contrast over #FFFF00`	7.722	4.5	✓ Geçti
Açık	`text-subtlest` / `material-glass-regular-contrast over #FF0000`	6.822	4.5	✓ Geçti
Açık	`text-subtlest` / `material-glass-regular-contrast over #00FF00`	7.455	4.5	✓ Geçti
Açık	`icon-default` / `material-glass-regular-contrast over #FFFFFF`	15.133	3	✓ Geçti
Açık	`icon-default` / `material-glass-regular-contrast over #000000`	12.694	3	✓ Geçti
Açık	`icon-default` / `material-glass-regular-contrast over #808080`	13.881	3	✓ Geçti
Açık	`icon-default` / `material-glass-regular-contrast over #0000FF`	12.870	3	✓ Geçti
Açık	`icon-default` / `material-glass-regular-contrast over #FFFF00`	14.957	3	✓ Geçti
Açık	`icon-default` / `material-glass-regular-contrast over #FF0000`	13.212	3	✓ Geçti
Açık	`icon-default` / `material-glass-regular-contrast over #00FF00`	14.438	3	✓ Geçti
Açık	`action-on-primary-default` / `action-primary-default glass over #FFFFFF`	13.010	4.5	✓ Geçti
Açık	`action-on-primary-default` / `action-primary-default glass over #000000`	17.495	4.5	✓ Geçti
Açık	`action-on-primary-default` / `action-primary-default glass over #808080`	15.242	4.5	✓ Geçti
Açık	`action-on-primary-default` / `action-primary-default glass over #0000FF`	17.070	4.5	✓ Geçti
Açık	`action-on-primary-default` / `action-primary-default glass over #FFFF00`	13.255	4.5	✓ Geçti
Açık	`action-on-primary-default` / `action-primary-default glass over #FF0000`	16.300	4.5	✓ Geçti
Açık	`action-on-primary-default` / `action-primary-default glass over #00FF00`	14.035	4.5	✓ Geçti
Koyu	`text-default` / `surface-default`	15.972	4.5	✓ Geçti
Koyu	`text-default` / `surface-layer-2`	12.644	4.5	✓ Geçti
Koyu	`text-subtle` / `surface-default`	11.247	4.5	✓ Geçti
Koyu	`text-default` / `surface-sunken`	17.176	4.5	✓ Geçti
Koyu	`text-subtle` / `surface-sunken`	12.094	4.5	✓ Geçti
Koyu	`text-default` / `surface-checker`	18.230	4.5	✓ Geçti
Koyu	`text-subtlest` / `surface-checker`	7.364	4.5	✓ Geçti
Koyu	`text-subtlest` / `surface-default`	6.452	4.5	✓ Geçti
Koyu	`text-subtlest` / `surface-raised`	5.857	4.5	✓ Geçti
Koyu	`text-placeholder` / `surface-raised`	5.857	4.5	✓ Geçti
Koyu	`text-link` / `surface-default`	15.972	4.5	✓ Geçti
Koyu	`text-danger` / `surface-raised`	9.609	4.5	✓ Geçti
Koyu	`text-success` / `surface-raised`	10.217	4.5	✓ Geçti
Koyu	`text-warning` / `surface-raised`	9.748	4.5	✓ Geçti
Koyu	`text-info` / `surface-raised`	9.981	4.5	✓ Geçti
Koyu	`text-on-brand` / `surface-brand`	14.231	4.5	✓ Geçti
Koyu	`text-inverse` / `surface-inverse`	17.176	4.5	✓ Geçti
Koyu	`action-on-primary-default` / `action-primary-default`	14.231	4.5	✓ Geçti
Koyu	`action-on-primary-default` / `action-primary-hovered`	12.094	4.5	✓ Geçti
Koyu	`action-on-secondary-default` / `action-secondary-default`	14.498	4.5	✓ Geçti
Koyu	`action-on-danger-default` / `action-danger-default`	9.730	4.5	✓ Geçti
Koyu	`action-on-danger-subtle-default` / `action-secondary-default`	9.609	4.5	✓ Geçti
Koyu	`action-on-danger-subtle-default` / `surface-default`	10.586	4.5	✓ Geçti
Koyu	`action-on-danger-subtle-default` / `action-danger-subtle-hovered`	10.788	4.5	✓ Geçti
Koyu	`action-on-danger-subtle-default` / `action-danger-subtle-pressed`	8.885	4.5	✓ Geçti
Koyu	`data-positive` / `surface-raised`	10.217	4.5	✓ Geçti
Koyu	`data-negative` / `surface-raised`	9.609	4.5	✓ Geçti
Koyu	`status-neutral-foreground` / `status-neutral-background`	10.477	4.5	✓ Geçti
Koyu	`status-neutral-on-emphasis` / `status-neutral-emphasis`	7.662	4.5	✓ Geçti
Koyu	`status-brand-foreground` / `status-brand-background`	9.205	4.5	✓ Geçti
Koyu	`status-brand-on-emphasis` / `status-brand-emphasis`	8.741	4.5	✓ Geçti
Koyu	`status-info-foreground` / `status-info-background`	10.449	4.5	✓ Geçti
Koyu	`status-info-on-emphasis` / `status-info-emphasis`	8.685	4.5	✓ Geçti
Koyu	`status-success-foreground` / `status-success-background`	10.487	4.5	✓ Geçti
Koyu	`status-success-on-emphasis` / `status-success-emphasis`	8.922	4.5	✓ Geçti
Koyu	`status-warning-foreground` / `status-warning-background`	10.486	4.5	✓ Geçti
Koyu	`status-warning-on-emphasis` / `status-warning-emphasis`	8.526	4.5	✓ Geçti
Koyu	`status-danger-foreground` / `status-danger-background`	10.542	4.5	✓ Geçti
Koyu	`status-danger-on-emphasis` / `status-danger-emphasis`	8.350	4.5	✓ Geçti
Koyu	`text-subtle` / `status-info-background`	9.190	4.5	✓ Geçti
Koyu	`text-subtle` / `status-success-background`	9.020	4.5	✓ Geçti
Koyu	`text-subtle` / `status-warning-background`	9.303	4.5	✓ Geçti
Koyu	`text-subtle` / `status-danger-background`	9.440	4.5	✓ Geçti
Koyu	`status-neutral-foreground` / `surface-raised`	12.013	4.5	✓ Geçti
Koyu	`status-brand-foreground` / `surface-raised`	8.938	4.5	✓ Geçti
Koyu	`status-info-foreground` / `surface-raised`	11.607	4.5	✓ Geçti
Koyu	`status-success-foreground` / `surface-raised`	11.869	4.5	✓ Geçti
Koyu	`status-warning-foreground` / `surface-raised`	11.507	4.5	✓ Geçti
Koyu	`status-danger-foreground` / `surface-raised`	11.401	4.5	✓ Geçti
Koyu	`tag-red-foreground` / `tag-red-background`	10.542	4.5	✓ Geçti
Koyu	`tag-orange-foreground` / `tag-orange-background`	10.486	4.5	✓ Geçti
Koyu	`tag-green-foreground` / `tag-green-background`	10.487	4.5	✓ Geçti
Koyu	`tag-blue-foreground` / `tag-blue-background`	10.449	4.5	✓ Geçti
Koyu	`tag-violet-foreground` / `tag-violet-background`	10.545	4.5	✓ Geçti
Koyu	`tag-teal-foreground` / `tag-teal-background`	10.441	4.5	✓ Geçti
Koyu	`tag-pink-foreground` / `tag-pink-background`	10.529	4.5	✓ Geçti
Koyu	`status-neutral-foreground` / `surface-default`	13.234	4.5	✓ Geçti
Koyu	`status-brand-foreground` / `surface-default`	9.846	4.5	✓ Geçti
Koyu	`status-info-foreground` / `surface-default`	12.787	4.5	✓ Geçti
Koyu	`status-success-foreground` / `surface-default`	13.075	4.5	✓ Geçti
Koyu	`status-warning-foreground` / `surface-default`	12.676	4.5	✓ Geçti
Koyu	`status-danger-foreground` / `surface-default`	12.559	4.5	✓ Geçti
Koyu	`tag-violet-foreground` / `surface-default`	12.660	4.5	✓ Geçti
Koyu	`tag-teal-foreground` / `surface-default`	13.002	4.5	✓ Geçti
Koyu	`tag-pink-foreground` / `surface-default`	12.473	4.5	✓ Geçti
Koyu	`text-default` / `surface-layer-1`	14.498	4.5	✓ Geçti
Koyu	`text-subtle` / `surface-layer-1`	10.209	4.5	✓ Geçti
Koyu	`border-input` / `surface-raised`	3.191	3	✓ Geçti
Koyu	`border-focus` / `surface-default`	13.234	3	✓ Geçti
Koyu	`focus-ring` / `surface-raised`	4.500	3	✓ Geçti
Koyu	`icon-default` / `surface-default`	15.291	3	✓ Geçti
Koyu	`icon-subtle` / `surface-raised`	5.857	3	✓ Geçti
Koyu	`icon-danger` / `surface-raised`	7.437	3	✓ Geçti
Koyu	`icon-success` / `surface-raised`	8.192	3	✓ Geçti
Koyu	`icon-warning` / `surface-raised`	7.662	3	✓ Geçti
Koyu	`icon-info` / `surface-raised`	7.908	3	✓ Geçti
Koyu	`action-primary-default` / `surface-default`	13.234	3	✓ Geçti
Koyu	`border-danger` / `action-secondary-default`	7.437	3	✓ Geçti
Koyu	`illustration-ink` / `surface-default`	15.291	3	✓ Geçti
Koyu	`illustration-ink` / `illustration-surface`	13.881	3	✓ Geçti
Koyu	`illustration-ink` / `illustration-neutral-1`	12.105	3	✓ Geçti
Koyu	`illustration-ink` / `illustration-primary-soft`	10.586	3	✓ Geçti
Koyu	`illustration-success` / `surface-default`	9.024	3	✓ Geçti
Koyu	`illustration-warning` / `surface-default`	8.441	3	✓ Geçti
Koyu	`illustration-danger` / `surface-default`	8.193	3	✓ Geçti
Koyu	`chart-categorical-1` / `surface-raised`	7.908	3	✓ Geçti
Koyu	`chart-categorical-2` / `surface-raised`	10.104	3	✓ Geçti
Koyu	`chart-categorical-3` / `surface-raised`	4.360	3	✓ Geçti
Koyu	`chart-categorical-4` / `surface-raised`	4.266	3	✓ Geçti
Koyu	`chart-categorical-5` / `surface-raised`	7.374	3	✓ Geçti
Koyu	`chart-categorical-6` / `surface-raised`	4.658	3	✓ Geçti
Koyu	`chart-categorical-7` / `surface-raised`	9.609	3	✓ Geçti
Koyu	`chart-categorical-8` / `surface-raised`	5.857	3	✓ Geçti
Koyu	`status-neutral-emphasis` / `surface-raised`	5.857	3	✓ Geçti
Koyu	`status-neutral-emphasis` / `surface-default`	6.452	3	✓ Geçti
Koyu	`status-brand-emphasis` / `surface-raised`	6.682	3	✓ Geçti
Koyu	`status-brand-emphasis` / `surface-default`	7.361	3	✓ Geçti
Koyu	`status-info-emphasis` / `surface-raised`	7.908	3	✓ Geçti
Koyu	`status-info-emphasis` / `surface-default`	8.711	3	✓ Geçti
Koyu	`status-success-emphasis` / `surface-raised`	8.192	3	✓ Geçti
Koyu	`status-success-emphasis` / `surface-default`	9.024	3	✓ Geçti
Koyu	`status-warning-emphasis` / `surface-raised`	7.662	3	✓ Geçti
Koyu	`status-warning-emphasis` / `surface-default`	8.441	3	✓ Geçti
Koyu	`status-danger-emphasis` / `surface-raised`	7.437	3	✓ Geçti
Koyu	`status-danger-emphasis` / `surface-default`	8.193	3	✓ Geçti
Koyu	`chart-categorical-1` / `surface-default`	8.711	3	✓ Geçti
Koyu	`chart-categorical-2` / `surface-default`	11.130	3	✓ Geçti
Koyu	`chart-categorical-3` / `surface-default`	4.803	3	✓ Geçti
Koyu	`chart-categorical-4` / `surface-default`	4.700	3	✓ Geçti
Koyu	`chart-categorical-5` / `surface-default`	8.123	3	✓ Geçti
Koyu	`chart-categorical-6` / `surface-default`	5.131	3	✓ Geçti
Koyu	`chart-categorical-7` / `surface-default`	10.586	3	✓ Geçti
Koyu	`chart-categorical-8` / `surface-default`	6.452	3	✓ Geçti
Koyu	`text-default` / `surface-translucent over surface-default`	15.972	4.5	✓ Geçti
Koyu	`text-default` / `surface-translucent over surface-sunken`	16.150	4.5	✓ Geçti
Koyu	`text-default` / `surface-translucent over surface-raised`	15.791	4.5	✓ Geçti
Koyu	`text-default` / `material-glass-regular over #FFFFFF`	6.816	4.5	✓ Geçti
Koyu	`text-default` / `material-glass-regular over #000000`	11.751	4.5	✓ Geçti
Koyu	`text-default` / `material-glass-regular over #808080`	8.901	4.5	✓ Geçti
Koyu	`text-default` / `material-glass-regular over #0000FF`	11.167	4.5	✓ Geçti
Koyu	`text-default` / `material-glass-regular over #FFFF00`	7.029	4.5	✓ Geçti
Koyu	`text-default` / `material-glass-regular over #FF0000`	10.184	4.5	✓ Geçti
Koyu	`text-default` / `material-glass-regular over #00FF00`	7.742	4.5	✓ Geçti
Koyu	`text-subtle` / `material-glass-regular over #FFFFFF`	4.799	4.5	✓ Geçti
Koyu	`text-subtle` / `material-glass-regular over #000000`	8.275	4.5	✓ Geçti
Koyu	`text-subtle` / `material-glass-regular over #808080`	6.268	4.5	✓ Geçti
Koyu	`text-subtle` / `material-glass-regular over #0000FF`	7.864	4.5	✓ Geçti
Koyu	`text-subtle` / `material-glass-regular over #FFFF00`	4.949	4.5	✓ Geçti
Koyu	`text-subtle` / `material-glass-regular over #FF0000`	7.171	4.5	✓ Geçti
Koyu	`text-subtle` / `material-glass-regular over #00FF00`	5.451	4.5	✓ Geçti
Koyu	`icon-default` / `material-glass-regular over #FFFFFF`	6.525	3	✓ Geçti
Koyu	`icon-default` / `material-glass-regular over #000000`	11.250	3	✓ Geçti
Koyu	`icon-default` / `material-glass-regular over #808080`	8.522	3	✓ Geçti
Koyu	`icon-default` / `material-glass-regular over #0000FF`	10.691	3	✓ Geçti
Koyu	`icon-default` / `material-glass-regular over #FFFF00`	6.729	3	✓ Geçti
Koyu	`icon-default` / `material-glass-regular over #FF0000`	9.749	3	✓ Geçti
Koyu	`icon-default` / `material-glass-regular over #00FF00`	7.412	3	✓ Geçti
Koyu	`text-default` / `material-glass-regular-contrast over #FFFFFF`	7.725	4.5	✓ Geçti
Koyu	`text-default` / `material-glass-regular-contrast over #000000`	11.577	4.5	✓ Geçti
Koyu	`text-default` / `material-glass-regular-contrast over #808080`	9.478	4.5	✓ Geçti
Koyu	`text-default` / `material-glass-regular-contrast over #0000FF`	11.175	4.5	✓ Geçti
Koyu	`text-default` / `material-glass-regular-contrast over #FFFF00`	7.915	4.5	✓ Geçti
Koyu	`text-default` / `material-glass-regular-contrast over #FF0000`	10.467	4.5	✓ Geçti
Koyu	`text-default` / `material-glass-regular-contrast over #00FF00`	8.533	4.5	✓ Geçti
Koyu	`text-subtle` / `material-glass-regular-contrast over #FFFFFF`	5.439	4.5	✓ Geçti
Koyu	`text-subtle` / `material-glass-regular-contrast over #000000`	8.152	4.5	✓ Geçti
Koyu	`text-subtle` / `material-glass-regular-contrast over #808080`	6.674	4.5	✓ Geçti
Koyu	`text-subtle` / `material-glass-regular-contrast over #0000FF`	7.869	4.5	✓ Geçti
Koyu	`text-subtle` / `material-glass-regular-contrast over #FFFF00`	5.573	4.5	✓ Geçti
Koyu	`text-subtle` / `material-glass-regular-contrast over #FF0000`	7.371	4.5	✓ Geçti
Koyu	`text-subtle` / `material-glass-regular-contrast over #00FF00`	6.009	4.5	✓ Geçti
Koyu	`icon-default` / `material-glass-regular-contrast over #FFFFFF`	7.395	3	✓ Geçti
Koyu	`icon-default` / `material-glass-regular-contrast over #000000`	11.084	3	✓ Geçti
Koyu	`icon-default` / `material-glass-regular-contrast over #808080`	9.074	3	✓ Geçti
Koyu	`icon-default` / `material-glass-regular-contrast over #0000FF`	10.698	3	✓ Geçti
Koyu	`icon-default` / `material-glass-regular-contrast over #FFFF00`	7.578	3	✓ Geçti
Koyu	`icon-default` / `material-glass-regular-contrast over #FF0000`	10.021	3	✓ Geçti
Koyu	`icon-default` / `material-glass-regular-contrast over #00FF00`	8.170	3	✓ Geçti
Koyu	`action-on-primary-default` / `action-primary-default glass over #FFFFFF`	14.497	4.5	✓ Geçti
Koyu	`action-on-primary-default` / `action-primary-default glass over #000000`	11.507	4.5	✓ Geçti
Koyu	`action-on-primary-default` / `action-primary-default glass over #808080`	12.948	4.5	✓ Geçti
Koyu	`action-on-primary-default` / `action-primary-default glass over #0000FF`	11.723	4.5	✓ Geçti
Koyu	`action-on-primary-default` / `action-primary-default glass over #FFFF00`	14.281	4.5	✓ Geçti
Koyu	`action-on-primary-default` / `action-primary-default glass over #FF0000`	12.143	4.5	✓ Geçti
Koyu	`action-on-primary-default` / `action-primary-default glass over #00FF00`	13.646	4.5	✓ Geçti
Koyu	`icon-default` / `material-glass-clear over #FFFFFF`	3.251	3	✓ Geçti
Koyu	`icon-default` / `material-glass-clear over #000000`	13.702	3	✓ Geçti
Koyu	`icon-default` / `material-glass-clear over #808080`	6.525	3	✓ Geçti
Koyu	`icon-default` / `material-glass-clear over #0000FF`	11.121	3	✓ Geçti
Koyu	`icon-default` / `material-glass-clear over #FFFF00`	3.440	3	✓ Geçti
Koyu	`icon-default` / `material-glass-clear over #FF0000`	8.139	3	✓ Geçti
Koyu	`icon-default` / `material-glass-clear over #00FF00`	4.153	3	✓ Geçti

Dışa aktar

Çıktılar imzasız aday dosyalardır (unsigned-candidate); onaylı değildir. İmza ve sürüm marka paketi hattında yapılır.

Paylaşım bağlantısı

İçe aktar

Marka dosyası, DTCG dışa aktarımı veya manifest adayı yapıştırın ya da seçin.

Dosya seç

Nasıl çalışır

Rampa: Her renk OKLCH’ye çevrilir. 11 basamağın (50–950) açıklığı her marka için aynı sabit tablodan gelir; ton girdi renginden, doygunluk ise basamağa göre bir eğriyle girdinin doygunluğundan türetilir. sRGB dışına taşan basamakta açıklık ve ton korunur, yalnızca doygunluk azaltılır ve basamak “kırpıldı” olarak işaretlenir.
Kontrast kapısı: Her açık ve koyu mod çifti WCAG 2.x oranıyla, yuvarlanmadan ölçülür: metin en az 4,5:1, kenarlık ve durum göstergeleri en az 3:1. Tek bir çift kalırsa dışa aktarma kilitlenir ve ilk kalan kontrol adıyla gösterilir.
Öneriler: Kalan bir çift için araç yalnızca markaya ait basamağın açıklığını oynatır (ton ve doygunluk oranı korunur) ve önce/sonra oranını gösterir. Uygulanan her değişiklik marka dosyasına ve kontrast raporuna kaydedilir.
Koyu mod: Renkler tersine çevrilmez. Anlam katmanının koyu eşlemesi aynı rampaları kullanır; koyu modda kalan bir çift için araç, token’ı aynı rampada başka bir basamağa bağlayan bir istisna önerir. En fazla 8 istisna olabilir; 9. istisna dışa aktarmayı kilitler.
Renk görme: Önizleme protan, döteran ve tritan simülasyonuyla görülebilir. Grafik paletindeki renk çiftleri normal görmede ve her simülasyonda Oklab uzaklığıyla (ΔE OK) denetlenir; birbirine çok yakın çiftler uyarı olarak listelenir.
Materyal: Materyal seçicisi önizlemeyi opak ya da cam yüzeyde gösterir. Cam, her modun arkasına token renklerinden bir degrade çizer ve cam Button’ları ekler; marka cam tonlarının ardında görülür. Cam marka dosyasında saklanmaz, uygulama seçer.

Çıktılar

Dosya	İçerik
`<id>.json`	Marka dosyası; `packages/tokens/src/brands/` ile aynı şema, tohum renkler ve kayıtlı açıklık değişiklikleriyle
`<id>.manifest.candidate.json`	Manifest alanları için aday: yazı tipi ve lisansı, köşe yuvarlaklığı önayarı, `packVersion` önerisi
`<id>.tokens.dtcg.json`	Rampalar DTCG 2025.10 renk nesneleri olarak (`oklch` bileşenleri ve sRGB `hex`)
`<id>.preview.css`	Açık ve koyu mod için `--bigbang-color-*` değişkenleri; yalnızca önizleme ve karşılaştırma için
`<id>.figma-variables.json`	`light` ve `dark` modlu renk değişkenleri; kanal değerleri 0–1
`<id>.contrast.json`, `<id>.contrast.md`	Aynı çiftler, oranlar ve sonuçlar; açıklık değişiklikleri ve koyu mod istisnaları
`<id>.echarts-theme.json`	Her mod için ECharts teması: kategorik palet, eksen ve metin renkleri, sıralı palet

İçe aktarma marka dosyasını, DTCG dışa aktarımını ve manifest adayını kabul eder; tanımsız bir anahtar şema yoluyla birlikte reddedilir. Paylaşım bağlantısı durumu adresin # sonrasına sıkıştırılmış olarak yazar; yalnızca renkler ve seçenekler girer, marka kimliği ve logo girmez. Bağlantı 2.000 karakteri aşarsa araç bunun yerine dosya indirmeyi önerir.

Sınırlar

Logo yalnızca önizlemede gösterilir; betik, olay özniteliği veya dış bağlantı içeren SVG reddedilir. Logo hiçbir dışa aktarıma veya bağlantıya girmez.
Grafik önizlemesi ECharts kütüphanesini yüklemez; dışa aktarılan temanın renkleriyle çizilmiş bir SVG örneğidir.
APCA ölçüsü lisans incelemesi tamamlanana kadar kapalıdır; kapı WCAG 2.x oranıdır.

Klavye

Tüm kontroller sekme tuşuyla gezilir. Renk alanları seçicinin yanında #RRGGBB veya oklch(L C H) yazımını kabul eder; Enter ile uygulanır. Önizleme sekmeleri arasında sol ve sağ ok tuşlarıyla geçilir. Kontrol özeti, değiştiğinde tek bir kibar (polite) bölgede yalnızca sayı olarak duyurulur.