Format CSS compact agar selector, property, dan media query lebih mudah diperiksa.
Masukan / Hasil
Masukan, hasil, dan aksi salin ada di area utama ini. Contoh dan pemeriksaan dipisahkan di bawah.
Sesi lokal
Status masukan disimpan hanya di browser ini agar pekerjaan terakhir bisa dipulihkan tanpa akun.
Buka contoh, pemeriksaan, dan alat terkait setelah alur masukan dan hasil selesai.
Review snippet CSS
Format snippet CSS, salin laporan review CSS, lalu cek minify dan kontras warna.
Format snippet dan salin laporan berisi selector, token, cascade, specificity, dan checklist.
Jika CSS ringkas akan dibagikan, periksa kompresi, penghapusan komentar, dan laporan minify.
Cek token warna dengan kontras WCAG saat snippet mengubah warna terlihat.
Cek aksesibilitas warna
Konversi warna depan/latar, salin laporan kontras WCAG, lalu cek token CSS dan asset visual sebelum rilis.
Konversi pasangan HEX/RGB/HSL, cek AA/AAA, lalu salin laporan aksesibilitas.
Periksa nama token CSS, selector, dan nilai warna duplikat sebelum commit.
Cek apakah inisial brand atau ikon kecil tetap jelas pada latar yang dipilih.
Sebelum menyalin
Kegagalan umum
Alat terkait
Panduan
Buka contoh, pemeriksaan, dan alat terkait setelah alur masukan dan hasil selesai.
.card{display:flex;color:#111}@media (min-width:768px){.grid{grid-template-columns:repeat(3,1fr)}}:root{--gap:16px}.panel{padding:var(--gap);border:1px solid #ddd}Contoh CSS
Blok selector
1
Deklarasi
3
Media query
0
Baris hasil
5
Periksa selector, nilai, aturan @, dan ukuran minify sebelum menyalin.
Properti khusus
0
Tidak ada properti khusus terdeteksi.
Nilai warna
1
#111
Aturan @
0
Tidak ada aturan @ terdeteksi.
Rasio kompresi
0%
Perkiraan pengurangan setelah spasi dan komentar dihapus.
Pratinjau selector
Selector pertama yang ditemukan dalam snippet.
Laporan review CSS
Salin laporan handoff berisi selector, token, cascade, specificity, kompresi, peringatan, dan checklist.
Mode output
Rapikan
Blok selector
1
.card
Deklarasi
3
Properti khusus
0
Tidak ada properti khusus terdeteksi.
Nilai warna
1
#111
Aturan @
0
Tidak ada aturan @ terdeteksi.
Selector duplikat
Tidak
Risiko specificity ID
Tidak
Komentar ada
Tidak
Rasio kompresi
0%
Catatan review
Checklist review
# Laporan review CSS - Diperiksa pada: Waktu salin browser - Mode output: Rapikan - Karakter: 39 - Baris hasil: 5 - Blok selector: 1 - Deklarasi: 3 - Properti khusus: 0 - Nilai warna: 1 - Aturan @: 0 - Selector duplikat: Tidak - Risiko specificity ID: Tidak - Komentar ada: Tidak - Rasio kompresi: 0% - Raw CSS tidak disertakan dalam laporan ini; lampirkan snippet tersamar jika perlu. ## Catatan review - Formatter ringan ini untuk snippet kecil. Jalankan formatter proyek sebelum commit stylesheet besar. ## Checklist review - Uji CSS pada breakpoint, tema, dan browser tujuan sebelum rilis. - Pastikan urutan selector, duplikat, dan specificity sesuai cascade yang dimaksud. - Bandingkan properti khusus dan token warna dengan design system sebelum menyalin. - Pertahankan komentar lisensi dan handoff saat minify atau tempel ke docs. - Jalankan formatter proyek atau build pipeline sebelum commit perubahan stylesheet besar.
Hasil siap disalin
.card {
display:flex;
gap:16px;
color:#111
}