Bahasa
English English Vietnamese (Tiếng Việt) Vietnamese (Tiếng Việt) Chinese (简体中文) Chinese (简体中文) Portuguese (Brazil) (Português do Brasil) Portuguese (Brazil) (Português do Brasil) Spanish (Español) Spanish (Español) Indonesian (Bahasa Indonesia) Indonesian (Bahasa Indonesia)
Pembuat Pattern

Pembuat Pattern

Buat pola berulang seamless dari 29 bentuk dengan warna, skala, rotasi, dan jarak sesuai keinginan. Ekspor sebagai PNG, SVG, atau kode CSS.

Pembuat Pattern Seamless

Pembuat pattern seamless ini menyusun pola ubin berulang dari pustaka berisi 29 bentuk, lalu memungkinkan Anda mewarnai ulang dan mengubah bentuknya hingga pas dengan desain Anda. Pilih sebuah pola, atur warna dan slider, lalu saksikan pratinjau ubin diperbarui secara langsung di setiap perubahan.

Alat ini dibuat untuk pengembang web yang membutuhkan latar CSS, desainer grafis yang menyusun ubin seamless untuk karya cetak maupun digital, dan siapa pun yang sekadar ingin pola berulang yang cepat dan bisa dikustomisasi. Saat hasilnya sudah memuaskan, ekspor sebagai ubin PNG, SVG, atau CSS yang siap tempel.

Privat sejak awal: setiap pola digambar dan diekspor di browser Anda dengan Canvas API. Tidak ada yang diunggah ke server, dan tidak ada aktivitas yang dilacak.

Cara Menggunakan Pembuat Pattern

1

Pilih pola

Telusuri galeri pola dan klik thumbnail mana pun untuk memilihnya. Pratinjau langsung akan diperbarui seketika untuk menampilkan hasil ubinnya.

2

Kustomisasi warna

Tentukan warna Latar dan Pola dengan pemilih warna, atau klik salah satu dari 10 palet preset. Aktifkan Warna 2 untuk menambahkan warna kedua pada pola yang mendukungnya, seperti Konfeti, Kipas, dan Tulang Ikan.

3

Atur pengaturan

Sempurnakan tampilan dengan slider: Skala (10–100px), Rotasi (0–360°), Jarak (0–40px), Opasitas (5–100%), dan lebar Goresan (1–8px) untuk pola berbasis garis.

4

Ekspor pola Anda

Pilih ukuran ubin dari 100×100 hingga 800×800, lalu unduh ubin PNG atau SVG, atau salin kode CSS dengan pola tertanam sebagai data URI.

Fitur

29 Jenis Pola

Bentuk geometris, organik, abstrak, dan dekoratif — Titik, Kisi, Chevron, Heksagon, Gelombang, Sisik, Konfeti, Tulang Ikan, Bunga, Spiral, dan lainnya.

10 Palet Preset

Skema warna sekali klik: Indigo, Samudra, Hutan, Senja, Mawar, Ungu, Mono, Gelap, Tosca, dan Amber.

Warna Kustom

Tentukan sendiri warna latar dan pola Anda, dengan opsi warna kedua untuk pola dua warna.

Penyesuaian Halus

Atur skala, rotasi, jarak, opasitas, dan lebar goresan untuk mengubah bentuk pola mana pun persis seperti yang Anda inginkan.

Pratinjau Real-Time

Setiap perubahan warna dan slider langsung tampak pada pratinjau ubin — tanpa menunggu, tanpa muat ulang.

Ekspor PNG & SVG

Unduh ubin raster PNG atau SVG vektor yang dapat diperbesar, dengan ukuran ubin yang dapat diatur dari 100px hingga 800px.

Salin Kode CSS

Dapatkan CSS siap tempel dengan pola tertanam sebagai data URI — langsung pasang ke stylesheet Anda.

Acak

Satu klik menghasilkan pola, palet, dan pengaturan acak — cara cepat menemukan kombinasi tak terduga.

Mode Gelap

Tema gelap bawaan menjaga antarmuka tetap nyaman di cahaya redup.

Tata Letak Responsif

Berjalan di desktop, tablet, dan ponsel sehingga Anda bisa mendesain pola di layar apa pun.

Pertanyaan yang Sering Diajukan

Apa itu pola seamless?

Pola seamless adalah ubin yang berulang dengan sempurna ke segala arah tanpa sambungan atau celah yang terlihat. Saat ubin disusun bersebelahan, tepinya menyatu mulus membentuk satu desain yang menyambung — ideal untuk latar dan tekstur.

Bagaimana cara membuat pola latar yang berulang?

Klik sebuah pola di galeri, pilih warna dan palet Anda, lalu atur slider skala, rotasi, jarak, dan opasitas. Pratinjau akan menyusun ubin desain Anda secara langsung. Saat sudah pas, ekspor ubin PNG atau SVG, atau salin CSS untuk memakainya sebagai latar berulang.

Bisakah pola diekspor sebagai SVG dan PNG?

Bisa. PNG adalah format raster dengan resolusi tetap berdasarkan ukuran ubin yang Anda pilih — cocok untuk latar web. SVG adalah format vektor yang bisa diperbesar ke ukuran berapa pun, sesuai untuk karya cetak dan format besar. Keduanya diunduh sebagai satu ubin seamless.

Bagaimana cara kerja ekspor CSS?

Tombol Salin CSS menghasilkan aturan background-image dengan pola Anda dikodekan sebagai data URI, lengkap dengan properti repeat dan size. Tempelkan ke stylesheet Anda untuk memakai pola sebagai latar berulang tanpa perlu menyimpan berkas gambar terpisah.

Bisakah saya mengubah warna, skala, dan jarak?

Bisa. Tentukan warna latar dan pola, tambahkan opsi warna kedua, dan pilih dari 10 palet preset. Slider mengatur skala (10–100px), rotasi (0–360°), jarak (0–40px), opasitas (5–100%), dan lebar goresan (1–8px) untuk pola berbasis garis.

Apa fungsi slider Goresan?

Goresan mengatur ketebalan garis untuk pola yang dibangun dari garis, seperti Garis, Kisi, Gelombang, Lingkaran, Sisik, dan Panah. Pada pola padat seperti Titik, Wajik, dan Heksagon, pengaturan goresan tidak memberi efek yang terlihat.

Apakah polanya gratis untuk penggunaan komersial?

Ya. Pola dihasilkan sepenuhnya di browser Anda, jadi Anda memiliki apa pun yang Anda buat dan bisa memakainya untuk tujuan apa pun, termasuk proyek komersial.

Jenis Pola
Warna
Penyesuaian
30px
0px
100%
2px
Ekspor
Klik thumbnail pola untuk memilih, lalu atur warna dan slider
Aktifkan Warna 2 untuk pola dua warna seperti Konfeti, Kipas, dan Tulang Ikan
Gunakan tombol Acak untuk menemukan kombinasi pola yang menarik
Klik Salin CSS untuk mendapatkan kode latar siap pakai bagi situs Anda
Atur Rotasi untuk membuat variasi miring atau diagonal dari pola mana pun
Semua proses berjalan di browser Anda — tidak ada data yang diunggah
Ingin belajar lebih banyak? Baca dokumentasi →
1/7
Mulai ketik untuk mencari...
Mencari...
Tidak ada hasil yang ditemukan
Coba gunakan kata kunci yang berbeda