Brutalism UI: Kenapa Tren Desain Kasar Ini Balik Lagi
Irfan Mulyana
September 9, 2026 7:01 pm
.
9 min read
Verdict Cepat
Brutalism UI bukan desain yang “jelek karena males”. Ini gaya interface yang sengaja kasar: border tebal, sudut tajam, shadow hitam tanpa blur, dan tipografi besar yang jadi elemen utama. Tahun ini gaya ini balik karena web terasa terlalu seragam. Setelah bertahun-tahun tiap landing page pakai gradien ungu pink dan kartu membulat, desainer mulai bosan dan pengunjung mulai curiga. Brutalism jadi cara untuk terlihat manusia, bukan template yang dihasilkan AI.
Apa Itu Brutalism UI Sebenarnya
Brutalism di UI pinjam nama dari arsitektur brutalisme pertengahan abad ke-20, yang merayakan beton kasar dan struktur jujur ketimbang finishing dekoratif. Dalam bahasa antarmuka, ini berarti elemen yang tidak berusaha menyembunyikan konstruksinya: grid terlihat, elemen HTML tampil apa adanya, kontras tinggi hitam putih, dan penolakan terhadap estetika halus yang mendominasi web sepanjang dekade 2010-an.
Yang penting dipahami: brutalism bukan sekadar minimalis yang gagal. Minimalisme menghapus elemen sampai yang esensial tersisa. Brutalism mengelupas lapisan poles tapi menyimpan opini kuat. Halaman minimalis terasa netral. Halaman brutalist terasa deklaratif. Keduanya suka whitespace dan restraint, tapi niatnya berlawanan.
Ciri utama yang mudah dikenali meliputi border solid 1px sampai 4px, sudut 0px atau justru pill yang ekstrem, shadow offset keras tanpa blur, satu warna aksen yang dipakai hemat, dan tipografi oversized yang menjorok sampai ke tepi viewport. Bloomberg, Balenciaga, Are.na, dan Berghain memakai pendekatan ini dengan disiplin tinggi.
Kenapa Brutalism Balik di 2026
Ada tiga kekuatan yang bertemu tahun ini. Pertama, kelelahan desain. Selama 2024 dan 2025, rata-rata landing page SaaS punya latar gradien lembut, ilustrasi ramah, tiga kolom fitur, dan satu dua kartu kaca. Web mulai terasa seperti satu sistem desain raksasa yang dipakai semua orang. Brutalism adalah reaksi saat generasi desainer bosan dengan tema yang sama dan ingin yakin situsnya tidak terlihat seperti dua puluh lima situs berikutnya.
Kedua, pergeseran budaya ke arah kejujuran. Audiens 2026 percaya pada kejujuran lebih daripada kilau. Situs yang sengaja kasar memberi sinyal bahwa brand cukup percaya diri untuk tidak bersembunyi di balik production value. Sinyal itu langka dan berharga, itulah sebabnya rumah mode, publikasi editorial, dan SaaS berbasis kepercayaan menggunakannya.
Ketiga, banjir AI. Ketika generator gambar dan vibe-coding membanjiri web dengan visual “sempurna” yang seragam, brutalism jadi counter-movement. Terlihat buatan manusia adalah keunggulan kompetitif. Gaya ini membuktikan bahwa seorang desainer sungguh merancangnya, bukan algoritma.
Perbedaan Brutalism, Neo-Brutalism, dan Minimalisme
Istilah ini sering campur aduk. Tabel berikut membedakannya dengan jelas supaya tidak salah terapkan.
| Aspek | Brutalism | Neo-Brutalism | Minimalisme |
|---|---|---|---|
| Tipografi | System font, mono, weight besar | Sans ekstra hitam + mono aksen | Sans bersih, proporsional |
| Border | Hard 2px, kontras tajam | 3-4px solid, offset shadow | Halus atau tidak terlihat |
| Shadow | Tidak ada blur | Hard offset 4px 4px 0 | Soft, blur lembut |
| Warna | Hitam putih + 1 aksen | 3-4 warna kontras tinggi | Netral, low contrast |
| Niat | Struktur jujur | Utilitas mekanik | Pengurangan elemen |
Neo-brutalism 2026 lebih matang daripada tren nostalgia Web 1.0 tahun 2022. Ia buang gradien dan soft shadow, lalu ganti dengan kejelasan struktural. Yang berbeda dari versi lama: sekarang bisa diakses dan berkinerja tinggi, bukan sekadar kotak berwarna dengan border hitam.
Elemen Kunci yang Bikin Brutalism Berhasil
Brutalism yang bagus punya aturan di balik kasarnya. Tanpa aturan, yang muncul bukan gaya, melainkan antarmuka yang rusak.
Grid lines terlihat. Border 2px atau 4px menunjukkan struktur secara jujur. Ini transparansi struktural, bukan dekorasi. Tipografi jadi grafis. Headline memakai weight ultra hitam dengan tracking rapat, sering monospace, untuk memberi otoritas dan kesan teknis. Shadow solid offset, bukan blur. Kedalaman dibuat dengan 4px 4px 0px #000, bukan cahaya palsu. Palet dibatasi. Putih murni, hitam murni, dan satu aksen cerah sudah cukup. Asimetri disengaja. Layout tidak simetris seperti hasil AI, sehingga terasa buatan tangan.
Contoh nyata: Bloomberg membuka bagian editorial dengan headline masif yang menempel ke tepi viewport. Are.na memakai blok monospace rapat sebagai hompem. Berghain praktis adalah satu pernyataan tipografi raksasa. Polanya sama: headline menanggung seluruh hero, sisanya minggir.
Tiga aturan praktis saat memakai type-driven hero. Satu, pilih satu face dan commit. Dua face di hero brutalist adalah satu face terlalu banyak. Dua, set tipe hingga bleed. Tepi viewport adalah bagian dari komposisi, margin sama dengan keragu-raguan. Tiga, pasangkan skala dengan restraint. Kalau headline raksasa, copy pendukung tetap kecil dan tenang. Dua hal keras saling membatalkan.
Alasan type jadi interface utama tahun ini bukan cuma estetika. Ada mandat engineering untuk pangkas berat halaman. Ketika tipe viewport-scaled menggantikan hero image generik, bobot halaman turun dan brand narrative tetap dibawa oleh teks itu sendiri. Editor yang berani dan ringan di mesin bertemu di satu elemen.
Kapan Brutalism Cocok dan Kapan Menyudutkan Produk
Gaya ini menang saat brand sudah punya perhatian audiens. Ia gagal saat belum punya. Itu satu-satunya aturan yang menyortir sebagian besar kasus.
Brutalism pas untuk portfolio desainer dan seniman, SaaS indie yang audiensnya sudah membaca Are.na, situs editorial dan budaya, aplikasi musik, serta event tech untuk crowd muda. Dalam konteks itu, friksi adalah fitur. Portfolio brutalist yang butuh sejenak dipahami memberi sinyal selera, dan audiens menikmati teka-tekinya.
Brutalism menyudutkan produk saat audiens butuh tangan dituntun untuk paham tawaran, saat produk punya kerapatan fitur yang butuh hierarki poles, saat menjual ke industri sensitif seperti kesehatan atau keuangan, atau saat traffic didominasi akuisisi berbayar dingin. Pengunjung dingin belum invest perhatian, dan brutalism meminta mereka memecahkan halaman sendiri.
Data konversi menunjukkan pola arah yang jelas berdasarkan sumber traffic. Di traffic hangat, pengunjung kembali dan pencarian branded, layout kasar bertahan atau naik. Di akuisisi dingin, layout kasar kalah dari kontrol poles hampir setiap saat. Situs brutalist memang skor lebih tinggi di metrik “berkesan” dan “terasa seperti brand”, tapi skor lebih rendah di “tahu harus apa selanjutnya” untuk pengunjung pertama. Keduanya nyata.
Takeaway-nya bukan “brutalism tidak konversi”, melainkan “brutalism konversi di audiens yang tepat”. Kalau situs kebanyakan melayani traffic hangat, brutalism adalah kemenangan posisi. Kalau situs adalah kesan pertama untuk akuisisi berbayar dingin, brutalism meminta audiens melakukan pekerjaan yang belum mereka komitmenkan. Bedakan keduanya sebelum menyentuh piksel.
Brutalism yang Percaya Diri vs yang Malas
Ini beda tipis yang menentukan apakah situs terlihat disengaja atau sekadar rusak. Brutalism percaya diri itu padat. Grid rapat. Tipe disetel dengan care. Asimetri disengaja dan diseimbangkan dengan weight. Warna aksen muncul di tiga tempat yang membentuk segitiga di layout. Hover state disengaja, bukan absen.
Brutalism malas itu kosong. Terlalu banyak whitespace di mana keputusan seharusnya ada. Headline besar tapi sisanya default. Tidak ada ritme, tidak ada aksen, tidak ada pairing. Situs terlihat kasar karena memang tidak ada yang memutuskannya.
Tes sederhana: kalau satu elemen dihapus, apakah halaman terasa lebih buruk? Pada brutalism percaya diri, ya. Pada brutalism malas, tidak. Itu seluruh bedanya. Brand 2026 yang menjalankan brutalism benar tidak menang karena lebih berani. Mereka menang karena lebih disiplin, lalu menanggalkan makeup.
Hindari Jebakan Aksesibilitas
Aksesibilitas adalah tempat brutalism diam-diam gagal. Link biru default di atas blok berwarna bisa turun di bawah rasio kontras WCAG. Font piksel di ukuran kecil menghancurkan keterbacaan. Estetika bukan alasan untuk gagal audit.
Mulai dari kontras. Jalankan setiap kombinasi teks di atas warna terhadap WCAG dan tembus minimal 4.5:1 untuk body copy, meski look kasar menggoda untuk turun. Pertahankan focus state terlihat, karena situs brutalist sering menghilangkannya. Hindari font piksel di bawah 16px untuk teks yang harus dibaca. Tambahkan alt text asli dan HTML semantik di bawah permukaan kasar. Estetika hidup di border, warna, dan weight tipe, tidak satu pun di antaranya mewajibkan gagal audit.
Brutalism yang bertahan lama punya satu kesamaan, dan itu bukan HTML mentah. Kesamaannya adalah disiplin. Setiap situs brutalist yang kokoh punya hierarki visual paling rigor di web. Alasannya kasarnya terbaca percaya diri adalah karena sistem di bawahnya tidak biasa ketat.
Common Mistakes Saat Menerapkan Brutalism
Kesalahan pertama: mengira border keras dan font piksel sudah cukup. Siapa pun bisa tempel border hard dan font piksel ke interface lemah lalu menyebutnya brutalist. Produk tetap harus bekerja, hierarki tetap harus memandu, aksesibilitas tetap harus lulus.
Kesalahan kedua: kontras rendah yang menyamar sebagai “raw”. Teks low contrast di atas blok warna bukan jujur, itu tidak terbaca. Naikkan kontras atau ganti warna.
Kesalahan ketiga: menghilangkan focus state. Brutalism suka hapus dekorasi, tapi focus ring bukan dekorasi. Tanpa itu, navigasi keyboard patah.
Kesalahan keempat: asimetri yang terasa rusak bukan disengaja. Asimetri harus seimbang dengan weight dan ritme. Kalau terlihat seperti layout yang belum selesai, itu belum selesai.
Kesalahan kelima: mencampur tiga gaya retro jadi satu. Brutalist, Y2K revival, dan OS-inspired punya grammar visual berbeda. Menyatuinnya membuat hasil terlihat bingung, bukan intentional.
Pertanyaan Umum
Apakah brutalism sama dengan anti-design? Tidak, dan mencampuradukkan keduanya adalah cara proyek brutalist salah. Anti-design menolak aturan usability sengaja, sering sebagai seni. Brutalism UI menyimpan struktur fungsional dan readable, lalu mengelupas dekorasi di atasnya. Situs brutalist baik tetap punya hierarki jelas dan navigasi yang jalan, dengan tipe legible di sepanjang halaman.
Apakah harus pakai font piksel? Tidak harus. Banyak situs brutalist 2026 pakai system font, monospace, atau sans weight besar. Font piksel hanya satu opsi, dan ia berisiko di keterbacaan jika dipakai di ukuran kecil.
Apakah brutalist cocok untuk semua brand? Tidak. Gaya ini untuk brand dengan kepercayaan audiens yang sudah dibangun atau yang mau mendeklarasikan bobot budaya. Brand dengan traffic dingin dan produk yang butuh hand-holding lebih baik pakai pendekatan hangat dan terarah.
Final Thoughts
Brutalism UI 2026 bukan tentang terlihat jelek. Ini tentang mengelupas lapisan poles supaya pesan jadi hal terkeras di halaman. Gaya ini balik karena web terlalu seragam, dan tekanan itu struktural, bukan musiman. Gaya spesifik seperti Y2K chrome atau Windows 98 mungkin naik dan turun dalam dua tiga tahun. Tapi dorongan lebih dalam, desainer yang meraih kepribadian dan kemanusiaan melawan keseragaman hasil generator, akan bertahan lama.
Gunakan gaya ini saat ada yang ingin disampaikan. Lewati saat sekadar bosan dengan tampilan bersih. Brutalism terbaik 2026 tidak nostalgi untuk web lama. Ia pinjam keberaniannya untuk terlihat seperti buatan manusia, disengaja, dengan kontrol penuh atas setiap tepi kasar. Itu posisi yang layak diambil. Untuk desainer dan kreator di Indonesia yang ingin bedrooma dari lautan template, brutalism memberi ruang untuk berani tanpa harus mengorbankan fungsi.