Renkler
Renkler
Hiçbir bileşen bir renk adı vermez. Renk paletinde bulunur; açık ve koyu yüz için verilen on iki ton ölçeği olarak; renk şeması, sayfanın hangi yüzü okuyacağını seçer; bir bileşen bir rol okur — bir yüzey, bir kenar, bir metin — bu ölçek üzerinde bir yerdir. Cilt asla bir renk söylemez. Şemayı başlıktan değiştirin ve aşağıdaki her örnek, yeniden tanımlanmadan hareket eder.
Ölçekler
Bir palet, nötr, bir vurgu — marka — ve her biri on iki tonun ölçeği olan dört durum, Radix Temaları ve Material 3'ün bir rengi düzenleme şekline göre yerleştirilmiştir. Bir ölçek üzerindeki bir yer, her ölçek ve her iki yüz için de aynıdır: aşağıdaki numaraların ne için olduğu. Bir uygulama, vurgusunu vererek paletini getirir; her ölçek bunu takip eder.
--neutral-*
1
2
3
4
5
6
7
8
9
10
11
12
--accent-*
1
2
3
4
5
6
7
8
9
10
11
12
--info-*
1
2
3
4
5
6
7
8
9
10
11
12
--success-*
1
2
3
4
5
6
7
8
9
10
11
12
--warning-*
1
2
3
4
5
6
7
8
9
10
11
12
--error-*
1
2
3
4
5
6
7
8
9
10
11
12
- 1 bir çalışma bölgesinin zemin
- 2 sayfanın zemin, bölgeler etrafında ve arasında
- 3 bir alanın zemini; bir durumun oturduğu hafif zemin
- 4 yükseltilmiş bir kontrol; üzerine gelmiş bir zemin
- 5 bir kart, bir blok — ve onun belirgin kenarı
- 6 bir kenar
- 7 iki bölge arasındaki bir kenar
- 8 güçlü bir kenar, odak halkası
- 9 rengin bütünlüğü, işaretlediği şeyi doldurur
- 10 aynısı, üzerine gelmiş
- 11 renk mürekkep olarak, zeminler üzerinde okunabilir
- 12 güçlü mürekkep — nötr için, metnin kendisi
Yüzeyler
Alanlar, bölgeden dışarıya — her biri nötr ölçeğinde bir yer. Gösterge panelinin açık yüzü, bunları beyaza kadar açık olma durumuna göre sıralar, koyu yüz ise her birinin yerden ne kadar yüksekte olduğunu gösterir.
--surface-zoneBir sayfa bölgesinin üzerinde durduğu zemin--surface-pageSayfanın kendisi ve bölgeler arasındaki gösterim--surface-shellMenü, başlık, alt bilgi--surface-1Girişler ve alanlar--surface-2Düğmeler, araç çubukları--surface-3Bloklar, kartlar, modallar--surface-invertMetnin rengini alarak öne çıkan bir kontrolMetin
Üç dikkat seviyesi — nötr 12, 11 ve 9: okunan, onu nitelendiren ve yalnızca bakıldığında bulunan şey.
--text-color-default — Okunan metin
--text-color-muted — Etiketler, meta, alt başlıklar
--text-color-subtle — Ayrıcılar ve boş durumlar
Kenarlar
Ayrım yaptıkları şeylerle ayırt edilen dört ağırlık — nötr 5'ten 8'e: bir bölge içindeki iki şey, arkasındakinden bir alan, bir sayfanın iki bölgesi ve odaklanan şeyin halkası.
--border-color-discreet
--border-color-default
--border-color-region
--border-color-strong
Kategoriler
Yanındaki "değil" anlamına gelen on üç renk: bir grafiğin serisi, bir dağılımın segmentleri, bir iş akışının aşamaları. İsimlendirilmiş, numaralandırılmamış — bir uygulama `cat-mint` seçer çünkü nane gibi görünür — ve her biri diğerleri gibi bir ölçek, bu nedenle bir kategori, bir durum gibi giyilir: zemini 3, mürekkebi 11, dolu 9.
--cat-ruby-*
1
2
3
4
5
6
7
8
9
10
11
12
--cat-grapefruit-*
1
2
3
4
5
6
7
8
9
10
11
12
--cat-bittersweet-*
1
2
3
4
5
6
7
8
9
10
11
12
--cat-sunflower-*
1
2
3
4
5
6
7
8
9
10
11
12
--cat-straw-*
1
2
3
4
5
6
7
8
9
10
11
12
--cat-grass-*
1
2
3
4
5
6
7
8
9
10
11
12
--cat-mint-*
1
2
3
4
5
6
7
8
9
10
11
12
--cat-teal-*
1
2
3
4
5
6
7
8
9
10
11
12
--cat-aqua-*
1
2
3
4
5
6
7
8
9
10
11
12
--cat-blue-jeans-*
1
2
3
4
5
6
7
8
9
10
11
12
--cat-plum-*
1
2
3
4
5
6
7
8
9
10
11
12
--cat-lavender-*
1
2
3
4
5
6
7
8
9
10
11
12
--cat-pink-rose-*
1
2
3
4
5
6
7
8
9
10
11
12