Halaman ini diterjemahkan oleh Cloud Translation API.

Petak

Tampilan petak menampilkan dua kolom gambar atau lebih yang mewakili item konten, dengan teks singkat di bawah setiap gambar. Tampilan ini paling optimal jika pengguna terutama mengandalkan gambar untuk membuat pilihan.

Petak dapat di-scroll secara vertikal dan dapat bervariasi dalam ukuran, spasi, dan jumlah kolom. Konten di petak juga dapat dikelompokkan ke dalam kategori.

Komponen item daftar

Daftar memberikan cara alternatif untuk menampilkan konten yang memerlukan lebih banyak teks penjelasan

Anatomi

Petak berisi teks dan kontrol UI. Karena harus meresponsnya, pengguna tidak boleh disamarkan, baik oleh elemen lain maupun tepi layar.

Item petak

Teks utama dan sekunder

Latar belakang petak

Spesifikasi

Label tata letak

Definisi E, M, KL, P, Flex

Komponen item daftar

Spesifikasi, panduan gaya, dan lainnya

Petak konten (3 atau 4 kolom)

Petak aplikasi (4 kolom)

Petak aplikasi dengan item yang sering digunakan di baris atas

Penempatan ikon indikator dalam tata letak petak

Tata letak penskalaan

Tata letak referensi ini menunjukkan cara menyesuaikan petak untuk mengakomodasi layar dengan lebar dan tinggi yang berbeda. (Kategori lebar dan tinggi ditentukan di bagian Tata Letak.) Perhatikan bahwa semua nilai piksel dalam piksel yang dirender, sebelum terjadi down-sampling atau up-sampling.

Tata Letak

Margin, keyline, dan padding untuk berbagai ukuran layar

Label tata letak

Definisi E, M, KL, P, Flex

Layar dengan lebar standar

Layar lebar

Layar ekstra lebar dan super lebar

Spasi vertikal petak aplikasi pada layar dengan berbagai ketinggian

Untuk layar pendek, spasi vertikal harus dikurangi antara item konten petak dan antara ikon dan judul aplikasi.

Gaya

Pedoman tipografi

Referensi penskalaan dan petak, contoh tipografi, dan lainnya

Pedoman warna

Palet, nilai elevasi dan opasitas, serta lainnya

Tipografi

Gaya jenis	Jenis Huruf	Berat	Ukuran (dp)
Bodi 1	Roboto	Reguler	32
Bodi 2	Roboto	Reguler	28
Isi 3	Roboto	Reguler	24

Warna

Elemen	Warna(mode siang)	Warna (mode malam)
Jenis / ikon utama	Putih	Putih @ 88%
Jenis / ikon sekunder	Putih @ 72%	Putih @ 60%
Garis pemisah	Putih @ 22%	Putih @ 12%
Latar belakang petak	Black	Black
Scrim konten	T/A	Hitam @ 22%
Potongan gradien	Hitam @ 0-100% dalam 10% ruang teks	Hitam @ 0-100% dalam 10% ruang teks