İlkeler

Bu on kural tasarım sözleşmesidir. Her component, doküman sayfası ve örnek bunlara uyar. Bir değer bir token'la tanımlı değilse mevcut bir token'dan türetilir, asla uydurulmaz.

1. Tek accent, ölçülü kullanım

Etkileşimi ve seçimi tek bir soğuk mavi taşır. Geri kalan her şey mürekkep tonlu nötrlerdir.

2. Önce yüzey, sonra kenarlık

Kartlar sayfanın üzerindeki gri yüzeyde durur; gri yüzeyli bir bölümde ise beyaz yüzeye ve yumuşak bir gölgeye dönerler. Kenarlık son çaredir.

3. Yalnızca ince çizgiler

Her kenarlık 1px --mrd-line'dır. Seçim 1.5px'lik bir accent halkasıdır. Asla 2px, asla koyu kenarlık yok.

4. Yumuşak, uzun, silik gölgeler

Gölgeler her zaman mürekkep tonuyla renklendirilir, asla siyah olmaz. Tek doygun gölge birincil butonun parıltısıdır.

5. İç içe geçtikçe küçülen cömert köşeler

Yüzeyler iç içe geçtikçe köşe yuvarlaklığı küçülür: 20, sonra 14, sonra 12, sonra 8.

6. Sıkı başlıklar, ferah gövde

Başlıklar negatif harf aralığı ve dengeli satır kırılımıyla 600 ağırlığındadır; gövde metninin satır yüksekliği 1.6'dır. 700 ağırlığı hiç kullanılmaz.

7. Üç metin tonu

Ink, body ve muted. Hiyerarşi renkten değil, ton ve ağırlıktan gelir.

8. Sakin etkileşim

Hover bir arka plan tonu ya da 2–3px'lik bir yükselmedir; basma .97'lik bir küçülmedir; hepsi 150–200ms sürer. Azaltılmış hareket hepsini kaldırır.

9. Ferahlık

Büyük bölüm padding'leri, geniş aralıklar, en fazla 1160px içerik ve en fazla 720px okuma genişliği.

10. Sayfa başına tek dolgu blok

Bir sayfada en fazla bir dolgu renkli blok olur. Gradient yok; tek istisna skeleton shimmer.