Kita sudah memilih tiga warna yang kelihatannya cocok.
Biru tua.
Cream.
Orange.
Kalau dilihat satu per satu, semuanya bagus.
Masalahnya muncul ketika ketiga warna itu dimasukkan ke desain.
Background biru.
Card orange.
Heading cream.
Button biru lagi.
Beberapa icon orange.
Section berikutnya cream.
Border biru.
Badge orange.
Hasil akhirnya bukan terlihat harmonis.
Malah seperti semua warna sedang berebut perhatian.
Masalah seperti ini sering bukan karena kita memilih warna yang salah.
Masalahnya bisa berada pada berapa banyak setiap warna digunakan.
Dalam desain, kombinasi warna yang bagus belum tentu menghasilkan desain yang bagus kalau distribusinya tidak memiliki hierarchy.
Salah satu metode sederhana untuk mengaturnya adalah aturan 60-30-10.
Apa Itu Aturan 60-30-10 dalam Desain?
Secara sederhana, aturan 60-30-10 adalah prinsip pembagian warna dengan menggunakan sekitar 60% warna dominan, 30% warna sekunder, dan 10% warna aksen.
Konsep dasarnya:
60% → dominant color
30% → secondary color
10% → accent color
Tujuannya bukan menghitung setiap pixel secara matematis.
Tujuannya adalah menciptakan hierarki visual sehingga warna memiliki peran yang jelas.
Satu warna membangun dasar.
Satu warna mendukung.
Satu warna menarik perhatian.
Hasilnya biasanya terasa jauh lebih terkontrol daripada memberikan porsi yang sama kepada semua warna.
Kenapa Bukan 33-33-33?
Misalnya kita punya tiga warna.
Kenapa tidak digunakan sama banyak?
Karena ketika semua elemen memiliki kekuatan visual yang sama, mata tidak tahu mana yang harus diperhatikan terlebih dahulu.
Bayangkan tiga orang berbicara kepada kita dengan volume yang sama pada waktu bersamaan.
Tidak ada yang benar-benar terdengar jelas.
Desain bisa mengalami masalah serupa.
Warna Juga Membutuhkan Hierarchy
Satu warna menjadi panggung.
Satu warna menjadi supporting actor.
Satu lagi menjadi highlight.
Inilah logika sederhana di balik 60-30-10.
Apa Fungsi Warna 60%?
Bagian 60% adalah warna dominan.
Ini adalah warna yang paling banyak membentuk suasana keseluruhan desain.
Dalam website, warna dominan bisa muncul pada:
background,
section besar,
surface,
atau area kosong utama.
Dalam poster, bisa menjadi warna background terbesar.
Dalam interior, bisa berupa warna:
dinding,
lantai,
atau elemen visual besar.
Warna Dominan Tidak Harus Paling Mencolok
Ini penting.
“Dominan” berarti paling banyak digunakan.
Bukan harus paling terang.
Justru sering kali warna dominan relatif tenang.
Misalnya:
off-white,
cream,
light gray,
dark navy,
charcoal,
atau muted beige.
Kenapa?
Karena warna tersebut harus menampung banyak elemen lain.
Contoh Sederhana
Kita membuat landing page.
Gunakan:
60% off-white,
30% navy,
10% orange.
Off-white menjadi background utama.
Navy digunakan pada:
heading,
section tertentu,
navigation,
atau card.
Orange hanya digunakan pada:
button,
badge,
highlight,
atau detail penting.
Sekarang orange terasa kuat meskipun jumlahnya sedikit.
Inilah Kekuatan Accent Color
Semakin jarang digunakan, semakin mudah warna aksen menarik perhatian.
Kalau seluruh halaman orange, button orange tidak lagi terasa spesial.
Apa Fungsi Warna 30%?
Warna 30% adalah secondary color.
Fungsinya mendukung warna utama sekaligus memberikan contrast dan variasi.
Warna ini bisa digunakan pada:
secondary section,
card,
illustration,
heading,
furniture,
atau elemen berukuran sedang.
Secondary Color Menjaga Desain Tidak Monoton
Kalau desain hanya memiliki warna dominan dan aksen, tampilannya mungkin terlalu kosong atau kontrasnya terlalu ekstrem.
Warna sekunder menjadi jembatan.
Secondary Tidak Harus Lebih Gelap
Bisa lebih terang.
Bisa lebih saturated.
Bisa lebih muted.
Yang penting perannya berbeda dari dominant color.
Apa Fungsi Warna 10%?
Ini bagian yang paling menyenangkan.
Accent color.
Biasanya digunakan untuk elemen yang ingin segera terlihat.
Misalnya:
CTA,
button,
link tertentu,
icon,
badge,
notification,
highlight,
atau detail ilustrasi.
Accent Color Seperti Stabilo
Kita tidak menggunakan stabilo pada seluruh buku.
Kalau semua kalimat disorot kuning, tidak ada lagi informasi yang terlihat penting.
Accent color bekerja dengan prinsip serupa.
Sedikit Bisa Lebih Kuat
Misalnya halaman hampir seluruhnya:
putih,
abu-abu,
dan hitam.
Kemudian ada satu tombol merah.
Mata langsung menuju tombol tersebut.
Bukan karena tombolnya sangat besar.
Tetapi karena warnanya langka dalam komposisi.
Apakah Harus Tepat 60%, 30%, dan 10%?
Tidak.
Ini bukan formula kimia.
Kita tidak perlu membuka Photoshop lalu menghitung:
“Background ini baru 58,7%, berarti kurang 1,3%.”
Angka tersebut lebih tepat dipahami sebagai panduan proporsi visual.
Bisa saja desain bekerja dengan:
70-20-10,
65-25-10,
atau pembagian lain.
Prinsipnya Lebih Penting daripada Angkanya
Yang ingin kita hindari adalah semua warna memiliki bobot yang sama tanpa alasan.
Harus ada hierarchy.
Dari Mana Aturan 60-30-10 Berasal?
Aturan ini sangat populer dalam pembahasan desain dan interior.
Namun lebih aman memahaminya sebagai heuristic atau guideline, bukan hukum universal yang wajib diikuti setiap designer.
Banyak desain hebat sama sekali tidak menggunakan pembagian tersebut.
Jadi Kenapa Tetap Berguna?
Karena memberikan titik awal.
Terutama ketika kita:
bingung memilih proporsi,
baru belajar warna,
atau merasa desain terlalu ramai.
Beginner Membutuhkan Constraint
Canvas kosong punya terlalu banyak kemungkinan.
Constraint membantu mempersempit keputusan.
Daripada:
“Gue mau pakai warna ini di mana ya?”
kita punya framework:
dominant,
secondary,
accent.
Sekarang setiap warna punya pekerjaan.
Contoh 60-30-10 untuk Poster
Misalnya kita membuat poster festival musik.
Palette:
dark navy,
cream,
electric lime.
60% Dark Navy
Background utama.
30% Cream
Typography besar dan graphic shapes.
10% Lime
Tanggal.
Highlight.
Small graphic details.
Sekarang lime menjadi pusat perhatian.
Kalau Lime Digunakan 60%?
Mood desain langsung berubah.
Bukan salah.
Tetapi visual hierarchy-nya berbeda.
Warna yang Sama Bisa Menghasilkan Desain Berbeda
Proporsi mengubah karakter.
Ini bagian yang sering dilupakan ketika membuat color palette.
Color Palette Bukan Hanya Daftar Hex Code
Misalnya:
#111827
#F5F1E8
#FF6B35
Itu baru menunjukkan warna apa yang digunakan.
Belum menunjukkan bagaimana warna tersebut digunakan.
Dua Designer Bisa Memakai Palette Sama
Designer A menghasilkan desain elegant.
Designer B menghasilkan desain chaotic.
Kenapa?
Karena:
proportion,
typography,
spacing,
hierarchy,
dan layout
berbeda.
Warna Tidak Bekerja Sendirian
Color theory tidak bisa menyelamatkan layout yang buruk.
Bagaimana Menggunakan 60-30-10 pada Website?
Website adalah contoh yang bagus karena punya banyak elemen.
Misalnya palette:
white,
dark blue,
coral.
60% White
Background utama.
Whitespace.
Content surfaces.
30% Dark Blue
Navigation.
Heading.
Footer.
Beberapa card.
10% Coral
Primary button.
Link highlight.
Active state.
Small icon.
CTA Sekarang Mudah Ditemukan
Karena coral tidak digunakan sembarangan.
Kesalahan Umum
Designer suka accent color.
Kemudian mulai menambahkannya ke:
heading,
border,
background,
icon,
footer,
card,
illustration,
semuanya.
Akhirnya accent berubah menjadi dominant tanpa sadar.
Kalau Semua Accent, Tidak Ada Accent
Ini prinsip yang worth diingat.
Bagaimana dengan UI Design?
Konsep serupa bisa membantu, tetapi UI memiliki kebutuhan tambahan.
Warna juga membawa fungsi.
Misalnya:
success,
warning,
error,
information,
disabled state.
Jangan Memaksakan Semua Semantic Color ke 60-30-10
Error tetap perlu terlihat sebagai error.
Accessibility lebih penting daripada menjaga rasio estetis.
Function Comes First
Design rule membantu.
Bukan mengalahkan usability.
Accent Color untuk CTA
Dalam landing page, accent sering digunakan untuk primary action.
Contoh:
Mulai Gratis
atau
Daftar Sekarang.
Tetapi Jangan Membuat Semua Button Sama Penting
Primary button bisa menggunakan accent.
Secondary button bisa lebih understated.
Sekarang hierarchy action juga jelas.
60-30-10 untuk Social Media Design
Misalnya membuat carousel Instagram.
Brand palette:
beige,
black,
green.
Gunakan beige sebagai base.
Black untuk typography dan struktur.
Green untuk highlight.
Slide demi Slide Tetap Terasa Konsisten
Karena proporsinya relatif stabil.
Tetapi Jangan Membuat Semua Slide Identik
Layout tetap bisa berubah.
Photo bisa berubah.
Composition bisa berubah.
Consistency Bukan Copy-Paste
Visual system harus memberi ruang untuk variasi.
60-30-10 untuk Presentasi
Slide deck sering rusak karena terlalu banyak warna.
Judul merah.
Chart biru.
Icon hijau.
Quote ungu.
Highlight orange.
Gunakan Sistem
Misalnya:
60% light neutral.
30% dark neutral.
10% brand accent.
Sekarang deck terasa satu keluarga.
Data Visualization Punya Kebutuhan Berbeda
Kalau chart membutuhkan beberapa kategori, kita mungkin memang perlu lebih banyak warna.
Jangan memaksakan tiga warna kalau informasi menjadi tidak terbaca.
Information Lebih Penting daripada Decoration
Warna pada chart harus membantu membedakan data.
60-30-10 untuk Interior
Prinsip ini juga terkenal dalam interior styling.
Misalnya living room:
60% warm white,
30% walnut brown,
10% olive green.
60%
Dinding dan area besar.
30%
Sofa, rug, atau furniture.
10%
Cushion, artwork, vase, atau dekorasi kecil.
Hasilnya Terasa Terkoordinasi
Tetapi sekali lagi:
tidak perlu menghitung luas sofa dengan kalkulator.
Gunakan sebagai visual balance.
Bisa Pakai Lebih dari Tiga Warna?
Tentu.
60-30-10 bukan berarti desain hanya boleh memiliki tiga warna literal.
Satu kelompok bisa memiliki beberapa shade.
Contoh
60% neutral family:
white,
off-white,
light gray.
30% blue family:
navy,
slate,
soft blue.
10% orange family:
burnt orange,
peach accent.
Sekarang secara teknis ada banyak warna.
Tetapi secara visual tetap ada tiga kelompok utama.
Ini Lebih Fleksibel
Terutama untuk website dan interior.
Gunakan Tonal Variation
Satu hue bisa punya:
light,
medium,
dark.
Jangan Menambah Warna Baru Setiap Kali Butuh Contrast
Kadang yang dibutuhkan hanya shade lebih gelap.
Apa Itu Hue, Saturation, dan Lightness?
Supaya lebih mudah memahami palette, kita perlu mengenal tiga konsep.
Hue
Secara sederhana: keluarga warna.
Merah.
Biru.
Hijau.
Saturation
Seberapa intens atau muted warna terlihat.
Lightness
Seberapa terang atau gelap.
Dua Warna Biru Bisa Terasa Sangat Berbeda
Navy gelap dan pastel blue masih satu keluarga hue.
Tetapi mood-nya berbeda.
Saturation Sangat Memengaruhi Mood
Highly saturated colors terasa energetic.
Muted colors sering terasa lebih calm.
Jangan Hanya Memilih Hue
Pilih karakter warnanya.
Bagaimana Memilih Warna Dominan?
Mulai dari mood.
Apakah desain ingin terasa:
minimal,
playful,
luxury,
energetic,
natural,
futuristic,
atau editorial?
Dominant Color Membawa Banyak Mood
Kalau background utama hitam:
dramatic.
Kalau cream:
soft.
Kalau bright yellow:
energetic.
Tetapi Context Tetap Penting
Hitam untuk luxury brand bisa terasa premium.
Hitam untuk aplikasi anak-anak mungkin memberi mood berbeda.
Tidak Ada Warna yang Punya Satu Makna Universal
Makna dipengaruhi:
culture,
context,
industry,
dan kombinasi.
Bagaimana Memilih Secondary Color?
Cari warna yang membantu dominant color tanpa mencuri seluruh perhatian.
Bisa menggunakan:
analogous,
complementary,
split complementary,
atau neutral relationship.
Tidak Harus Menghafal Color Wheel
Untuk beginner, cukup mulai dengan:
satu warna utama,
satu warna pendukung,
satu accent.
Kemudian test.
Bagaimana Memilih Accent Color?
Accent perlu cukup berbeda untuk terlihat.
Kalau dominant dan secondary muted, accent bisa lebih saturated.
Contrast Membantu
Tetapi jangan hanya berpikir hue.
Brightness contrast juga penting.
Yellow di Atas White Bisa Sulit Dibaca
Walaupun warnanya berbeda.
Accessibility Tetap Harus Diperiksa
Terutama untuk text.
Jangan Mengorbankan Readability Demi Palette
Text yang cantik tetapi tidak terbaca tetap gagal sebagai komunikasi.
60-30-10 dan Typography
Warna juga bisa membantu hierarchy typography.
Misalnya:
heading dark navy,
body charcoal,
highlight coral.
Tetapi Ukuran dan Weight Tetap Penting
Jangan mengandalkan warna saja untuk membedakan heading.
Hierarchy yang Bagus Menggunakan Beberapa Sinyal
Size.
Weight.
Spacing.
Position.
Color.
Ini Nyambung dengan Visual Hierarchy
Artikel kita sebelumnya membahas bahwa mata perlu tahu apa yang dilihat pertama.
Color proportion adalah salah satu alat untuk menciptakan hierarchy tersebut.
Warna Accent Bisa Menjadi Level Tertinggi
Karena digunakan paling sedikit.
Contoh Landing Page
Headline:
dark.
Body:
neutral.
CTA:
bright accent.
Mata langsung menemukan CTA.
Kesalahan: Menggunakan Accent untuk Semua Heading
Sekarang halaman penuh accent.
CTA kehilangan keistimewaannya.
Kesalahan Umum dalam Aturan 60-30-10
Menganggap Angka Harus Presisi
Tidak perlu.
Memilih Tiga Warna yang Sama-Sama Sangat Kuat
Meskipun proporsinya berbeda, desain masih bisa melelahkan.
Menggunakan Accent Terlalu Banyak
Accent kehilangan fungsi.
Tidak Memikirkan Contrast
Palette harmonis belum tentu readable.
Mengabaikan Neutral
Neutral sering menjadi ruang bernapas yang dibutuhkan desain.
Menggunakan Warna Hanya karena Sedang Tren
Trend akan berubah.
Konteks project lebih penting.
Menggunakan Warna Tanpa Fungsi
Setiap warna sebaiknya punya alasan.
Cara Membuat Color Palette dengan 60-30-10
Mari buat sistem sederhana.
Langkah 1 — Tentukan Mood
Misalnya:
modern dan calm.
Langkah 2 — Pilih Dominant
Off-white.
Langkah 3 — Pilih Secondary
Deep green.
Langkah 4 — Pilih Accent
Warm orange.
Langkah 5 — Tentukan Peran
Off-white:
background.
Deep green:
heading dan section.
Orange:
CTA dan highlight.
Langkah 6 — Buat Shade
Green dark.
Green medium.
Orange light.
Langkah 7 — Test dengan Content Nyata
Jangan hanya melihat tiga kotak warna berdampingan.
Masukkan:
headline,
photo,
button,
paragraph,
card.
Palette yang Bagus di Pinterest Belum Tentu Bagus di Project
Karena project kita punya content sendiri.
Foto Juga Membawa Warna
Ini sering dilupakan.
Misalnya palette website:
cream,
brown,
green.
Kemudian hero image penuh:
bright red,
electric blue,
purple.
Secara visual, foto tersebut ikut menjadi bagian palette.
Image Tidak Netral
Foto punya color weight.
Jadi 60-30-10 Harus Dilihat dari Keseluruhan Komposisi
Bukan hanya CSS atau shape.
Illustration Juga Sama
Karakter dengan pakaian merah besar bisa membuat merah menjadi jauh lebih dominan daripada yang kita rencanakan.
Gunakan Desaturation Kalau Perlu
Atau pilih image yang lebih harmonis dengan palette.
Bagaimana dengan Black dan White?
Black dan white tetap warna dalam konteks komposisi visual.
Keduanya bisa menjadi bagian dominant atau secondary.
Minimalist Design Bisa Menggunakan
80% white,
15% black,
5% red.
Tidak masalah.
Rule Boleh Diubah
Selama hierarchy-nya jelas.
Monochromatic Design Tidak Butuh Tiga Hue
Misalnya seluruh desain menggunakan blue family.
60% pale blue.
30% medium blue.
10% dark navy.
Masih bisa menggunakan logika proporsi.
Accent Tidak Harus Warna Berbeda
Bisa hanya tone yang jauh lebih gelap.
Luxury Design Sering Menggunakan Accent Sangat Sedikit
Black.
Cream.
Gold.
Gold mungkin hanya muncul 3–5%.
Tetapi karena contrast dan association-nya kuat, tetap terasa penting.
More Gold Tidak Selalu More Luxury
Terlalu banyak malah bisa terlihat berlebihan.
Restraint Adalah Bagian dari Design
Mengetahui kapan berhenti sama pentingnya dengan mengetahui apa yang harus ditambah.
Bagaimana Kalau Desain Terasa Membosankan?
Jangan langsung menambah warna keempat.
Coba bermain dengan:
scale,
texture,
typography,
spacing,
photography,
shape,
dan composition.
Warna Bukan Satu-Satunya Sumber Variety
Poster hitam putih bisa sangat menarik kalau composition-nya kuat.
Sebaliknya, 12 Warna Tidak Bisa Menyelamatkan Layout Lemah
Kadang malah membuatnya semakin kacau.
60-30-10 untuk Branding
Brand identity biasanya punya:
primary color,
secondary palette,
accent/supporting colors.
Konsepnya mirip, tetapi branding system jauh lebih luas.
Brand Color Tidak Harus Selalu Mendominasi Setiap Desain
Misalnya logo merah.
Tidak berarti seluruh website harus 60% merah.
Brand dapat menggunakan neutral sebagai surface utama dan merah sebagai accent.
Ini Sering Membuat Brand Color Lebih Kuat
Karena tidak digunakan secara berlebihan.
Logo Bukan Wallpaper
Memberi ruang membuat identitas lebih sophisticated.
Bagaimana dengan Dark Mode?
Proporsi masih bisa digunakan.
Misalnya:
60% near-black,
30% dark gray/slate,
10% cyan.
Jangan Gunakan Pure Black untuk Semuanya Tanpa Pertimbangan
Layering surface bisa membantu depth.
Accent di Dark Background Terlihat Lebih Intens
Mungkin saturation perlu diturunkan.
Test di Device Nyata
Monitor berbeda bisa menampilkan warna berbeda.
Print Juga Berbeda dari Screen
RGB dan CMYK punya karakter berbeda.
Warna neon di monitor mungkin tidak tercetak sama.
Kalau Desain untuk Print, Lakukan Proof
Terutama kalau warna brand harus konsisten.
Material Juga Mengubah Warna
Kertas matte.
Glossy.
Uncoated.
Semua bisa menghasilkan tampilan berbeda.
Digital Design Punya Variasi Layar
Brightness.
Color profile.
Display quality.
Karena Itu Jangan Menilai Warna dari Satu Device Saja
Kalau project penting, test.
Cara Mengetahui Accent Terlalu Banyak
Coba lihat desain dari jauh.
Apa yang paling menonjol?
Kalau ada 15 benda berbeda yang semuanya meminta perhatian, accent mungkin terlalu tersebar.
Blur Test
Blur desain sedikit atau menyipitkan mata.
Apakah hierarchy masih terlihat?
Area besar?
Area medium?
Highlight kecil?
Grayscale Test
Ubah sementara ke grayscale.
Kalau seluruh hierarchy hilang, mungkin kita terlalu mengandalkan hue tanpa cukup contrast value.
Ini Trik Sederhana tetapi Berguna
Design harus tetap punya struktur.
Jangan Takut Mengurangi
Kalau desain terasa berantakan:
hapus satu warna.
Kurangi saturation.
Perbesar whitespace.
Batasi accent.
Editing Sering Berarti Subtraction
Bukan addition.
“Kayaknya Kurang Sesuatu”
Kadang benar.
Tetapi sering kali sebenarnya:
kebanyakan sesuatu.
Gunakan Constraint untuk Mempercepat Desain
Pilih:
3 color roles.
2 font families maksimal.
1 main visual.
1 primary CTA.
Sekarang decision fatigue berkurang.
Creativity Tidak Selalu Membutuhkan Pilihan Tak Terbatas
Constraint justru bisa membantu.
Apakah Designer Profesional Selalu Menggunakan 60-30-10?
Tidak.
Designer berpengalaman dapat menggunakan sistem warna yang jauh lebih kompleks atau sederhana.
Mereka Bisa Sengaja Melanggar Balance
Misalnya poster experimental menggunakan 90% neon orange.
Kalau disengaja dan mendukung konsep, itu valid.
Rule Bukan Polisi
Rule adalah alat.
Pelajari Rule Supaya Tahu Kapan Melanggarnya
Kalau kita belum memahami hierarchy, “breaking the rules” sering hanya menghasilkan kekacauan.
Kalau kita memahami fungsi rule, pelanggaran bisa menjadi keputusan kreatif.
Contoh Melanggar 60-30-10 dengan Sengaja
Poster olahraga mungkin menggunakan:
70% electric red,
20% black,
10% white.
Aggressive.
Energetic.
Cocok dengan konsep.
Editorial Fashion Bisa Hampir Monochrome
95% neutral.
5% accent.
Elegant.
Kids Design Bisa Menggunakan Banyak Warna
Karena mood yang dicari memang playful.
Jadi Jangan Memaksa Semua Project Masuk Formula Sama
Gunakan 60-30-10 ketika membantu.
Tinggalkan ketika tidak.
Cara Praktis untuk Beginner
Kalau desain terasa kacau, jangan langsung ganti semua warna.
Tanyakan tiga pertanyaan:
Warna mana yang menjadi dasar?
Warna mana yang mendukung?
Warna mana yang hanya digunakan untuk menarik perhatian?
Kalau kita tidak bisa menjawab, kemungkinan color hierarchy belum jelas.
Buat Tiga Label
Dominant.
Secondary.
Accent.
Kemudian masukkan setiap elemen ke salah satunya.
Button Penting?
Accent.
Background Utama?
Dominant.
Card Besar?
Dominant atau secondary.
Heading?
Secondary atau neutral hierarchy.
Badge Penting?
Accent.
Sekarang sistem mulai muncul.
Jangan Berikan Accent ke Dekorasi yang Tidak Penting
Kalau CTA dan decorative star sama-sama orange terang, keduanya bersaing.
Prioritaskan Informasi
Color hierarchy harus mengikuti content hierarchy.
Design Bukan Sekadar Membuat Sesuatu Cantik
Desain membantu komunikasi.
Kalau warna membuat orang salah fokus, secara visual mungkin menarik tetapi komunikasinya kurang efektif.
Color Harus Menjawab “Lihat ke Mana?”
Itulah hubungannya dengan visual hierarchy.
Dari Visual Hierarchy ke Color Hierarchy
Artikel sebelumnya di Multiple de Trois membahas masalah:
“Desain terlihat ramai dan nggak tahu harus lihat ke mana.”
Sekarang kita punya salah satu jawabannya:
atur proporsi warna.
Tidak semua elemen perlu berteriak.
Dominant Memberikan Ruang
Secondary membangun struktur.
Accent memberikan fokus.
Tiga peran.
Satu sistem sederhana.
FAQ
Apa itu aturan 60-30-10 dalam desain?
Aturan 60-30-10 adalah guideline pembagian warna dengan sekitar 60% warna dominan, 30% warna sekunder, dan 10% warna aksen untuk membantu menciptakan komposisi yang lebih seimbang.
Apakah aturan 60-30-10 harus tepat?
Tidak. Angka tersebut sebaiknya dipahami sebagai panduan proporsi visual, bukan perhitungan matematis yang harus presisi.
Apa fungsi warna 60%?
Warna 60% menjadi warna dominan yang membangun dasar dan suasana utama desain.
Apa fungsi warna 30%?
Warna sekunder digunakan untuk mendukung warna dominan sekaligus memberikan variasi dan struktur.
Apa fungsi warna 10%?
Warna aksen digunakan secara lebih terbatas untuk menarik perhatian ke elemen penting seperti CTA, highlight, atau detail tertentu.
Apakah 60-30-10 bisa digunakan untuk website?
Bisa. Prinsipnya dapat membantu membagi warna background, surface, typography, section, dan accent seperti button atau highlight.
Apakah bisa menggunakan lebih dari tiga warna?
Bisa. Beberapa shade dapat dikelompokkan ke dalam satu color family sehingga sistem visual tetap memiliki dominant, secondary, dan accent.
Apakah aturan ini cocok untuk interior?
Ya, 60-30-10 juga populer sebagai guideline dalam interior styling untuk membagi warna pada area besar, furniture, dan aksen dekorasi.
Apakah desain profesional wajib menggunakan aturan 60-30-10?
Tidak. Ini hanyalah salah satu guideline. Designer dapat menggunakan proporsi lain sesuai tujuan visual, fungsi, dan karakter project.
Kesimpulan
Memilih warna yang bagus hanyalah setengah pekerjaan.
Bagian berikutnya adalah menentukan:
warna tersebut harus muncul seberapa banyak?
Tiga warna yang terlihat sempurna di sebuah palette bisa berubah menjadi desain yang berantakan ketika semuanya digunakan dengan intensitas yang sama.
Di sinilah aturan 60-30-10 dalam desain bisa menjadi titik awal yang sangat berguna.
Gunakan sekitar:
60% sebagai dominant color,
30% sebagai secondary color,
dan
10% sebagai accent color.
Tidak perlu menghitung pixel.
Tidak perlu mengejar angka presisi.
Yang penting adalah memahami hierarchy-nya.
Warna dominan memberikan ruang.
Warna sekunder membangun struktur.
Warna aksen menarik perhatian.
Kalau semuanya menjadi accent, tidak ada lagi yang terasa penting.
Dan kalau suatu hari kita sudah memahami sistemnya lalu merasa desain tertentu membutuhkan:
70-20-10,
80-15-5,
atau bahkan pendekatan yang benar-benar berbeda—
tidak masalah.
Karena 60-30-10 bukan aturan yang harus dipatuhi.
Ia adalah alat untuk membantu kita membuat keputusan visual dengan lebih sadar.
Dalam desain, mengetahui kenapa sebuah aturan bekerja jauh lebih berguna daripada sekadar menghafal angkanya.
