Tool gratis

Generator palet warna

Taruh foto. Dapatkan warna utamanya dengan kode HEX dan RGB, cek kontras terhadap teks putih dan hitam, dan pratinjau halaman link bio dengan warna-warna itu.

Fotomu

Jumlah warna
Urutan

Paletmu

    Pratinjau di halaman link bio

    Ana Ruiz

    Kelas keramik dan tembikar

    Belanja mug baruBooking kelasVideo terbaru

      Apa fungsi generator color palette

      Generator color palette menemukan warna utama dalam gambar dan memberimu kodenya. Tool ini membaca fotomu di browser, mengelompokkan piksel yang mirip, dan menghasilkan 5, 6, atau 8 warna yang paling banyak menutupi gambar. Setiap warna disertai kode HEX dan RGB serta cek kontras untuk teks.

      Kreator memakai palet dari foto mereka sendiri agar profil, postingan, dan halaman link bio terlihat sebagai satu set. Cek kontras memberi tahu warna mana yang bisa dipakai untuk teks, dan mana yang lebih cocok sebagai latar belakang atau aksen.

      Fotomu tidak pernah meninggalkan perangkatmu. Tool ini menggambarnya di canvas di browser, jadi tanpa upload, tanpa akun, dan tanpa batas.

      Cara membuat palet dari foto

      1. Taruh foto

        Pakai foto yang sering kamu posting, seperti foto profil atau foto produk. File JPG, PNG, dan WebP bisa dipakai.

      2. Pilih jumlah warna

        Pilih 5, 6, atau 8 warna. Urutkan berdasarkan seberapa banyak foto yang ditutupinya, atau dari terang ke gelap.

      3. Cek kontrasnya

        Setiap warna menampilkan kontrasnya dengan teks putih dan hitam. Pakai warna yang lolos untuk tombol bertuliskan teks.

      4. Salin kodenya

        Salin satu kode HEX, seluruh daftar, atau palet sebagai variabel CSS untuk websitemu.

      Aturan kontras untuk teks di atas warnamu

      Web Content Accessibility Guidelines (WCAG 2.2) menetapkan kontras minimum antara teks dan latar belakangnya. Badge di tool memakai angka-angka ini.

      Yang kamu cekRasio minimumAturan WCAG
      Teks normal di atas warna4.5:11.4.3 Contrast (Minimum), level AA
      Teks besar: 24px, atau 18,5px tebal3:11.4.3 Contrast (Minimum), level AA
      Teks normal, level lebih ketat7:11.4.6 Contrast (Enhanced), level AAA
      Teks besar, level lebih ketat4.5:11.4.6 Contrast (Enhanced), level AAA
      Tombol atau ikon terhadap halaman3:11.4.11 Non-text Contrast, level AA

      Sumber: W3C, Understanding 1.4.3 Contrast (Minimum), W3C, Understanding 1.4.6 Contrast (Enhanced), W3C, Understanding 1.4.11 Non-text Contrast. Dicek 11 November 2026.

      Di halaman More.You kamu

      Warnamu di halaman link bio kamu

      Di halaman More.You, kamu mengatur sendiri latar belakang, tombol, font, dan warna. Setiap perubahan masuk ke draf dengan undo, jadi halaman yang tayang tidak pernah menampilkan desain setengah jadi.

      more.you/

      • Tema dan warna di paket Free

        Pilih tema, lalu ubah wallpaper, gaya tombol, font, dan warna. Acak galeri tema saat kamu butuh ide.

        Tema dan desain

      • Mulai dari template

        Template berdasarkan profesi memberimu halaman pertama yang sudah jadi. Terapkan satu, lalu ganti dengan warna dari fotomu.

        Template link bio

      • Lima layout header

        Header classic, hero, banner, cutout, dan shape menaruh fotomu di tempat yang paling cocok dengan palet.

      Pertanyaan seputar color palette

      Bagaimana generator color palette memilih warnanya?

      Tool ini mengecilkan fotomu menjadi salinan kecil, membaca setiap piksel, dan mengelompokkan piksel ke grup warna yang mirip dengan metode bernama median cut. Rata-rata tiap grup dihitung, warna yang hampir sama dibuang, dan warna yang menutupi bagian foto terbesar dipertahankan.

      Apakah foto saya diunggah ke suatu tempat?

      Tidak. Tool ini membuka fotomu di browser dan membacanya di elemen canvas di perangkatmu. Tidak ada yang dikirim ke More.You atau server lain, dan tidak ada yang disimpan. Tutup tab dan foto serta palet langsung hilang.

      Apa arti kode HEX dan RGB?

      Keduanya menggambarkan warna yang sama. RGB memberi jumlah merah, hijau, dan biru dari 0 sampai 255, misalnya rgb(178, 246, 227). HEX menulis tiga angka yang sama dalam basis 16 setelah tanda pagar, misalnya #B2F6E3. Kebanyakan aplikasi desain dan website builder menerima keduanya.

      Berapa kontras yang dibutuhkan teks agar terbaca?

      WCAG 2.2, standar aksesibilitas web, meminta rasio kontras minimal 4,5:1 untuk teks normal dan 3:1 untuk teks besar di level AA. Teks besar berarti 24px, atau 18,5px dalam huruf tebal. Badge di samping tiap warna menunjukkan rasionya dengan teks putih dan hitam.

      Bagaimana memakai palet ini di halaman link bio saya?

      Pakai warna paling terang sebagai latar belakang halaman dan warna yang lebih kuat untuk tombol. Lalu cek bahwa teks tombol lolos 4,5:1 di warna tombol. Pratinjau di tool menampilkan susunan ini dan memberi tahu pasangan mana yang lolos.

      File jenis apa yang bisa saya pakai?

      Gambar apa pun yang bisa dibuka browser kamu, seperti JPG, PNG, WebP, dan GIF. Untuk GIF, tool membaca frame pertama. Kalau file tidak terbuka, simpan sebagai JPG atau PNG di ponsel atau komputer lalu coba lagi.

      Bisakah saya menyalin palet sebagai CSS?

      Bisa. Pilih Salin sebagai variabel CSS untuk mendapat blok :root dengan satu variabel per warna, misalnya --color-1: #B2F6E3. Tempel di bagian atas stylesheet dan pakai var(--color-1) di mana pun kamu butuh warna itu. Variabel mengikuti urutan pilihanmu, jadi --color-1 adalah warna yang paling banyak dipakai atau yang paling terang.

      Tools gratis lainnya

      Gratis, tanpa akun. Apa pun yang kamu ketik tidak disimpan di server kami.

      Generator font

      Ubah teksmu jadi 24 gaya, dari bold dan italic sampai script dan bubbles. Salin dan tempel di mana saja.

      Buka tool →

      Generator bio

      Dapatkan 12 ide bio untuk Instagram, TikTok, X, atau YouTube, lengkap dengan hitungan karakter langsung.

      Buka tool →

      QR code generator

      Ubah link apa pun jadi QR code. Pilih warna, unduh PNG atau SVG. Tidak pernah kedaluwarsa.

      Buka tool →

      Lihat semua tools gratis

      Panduan: Panduan Desain Halaman Bio: Layout, Tema, Tombol, Tema Link Bio: Cara Memilih yang Bikin Orang Klik.

      Halaman terkait
      Sumber
      1. W3C, Understanding SC 1.4.3 Contrast
      2. W3C, Understanding SC 1.4.6 Contrast
      3. W3C, Understanding SC 1.4.11 Non-text Contrast

      Sumber dicek pada 11 November 2026.

      Warnamu, di halamanmu sendiri

      Klaim halaman More.You gratis dan atur latar belakang, tombol, dan font dengan warna dari fotomu.

      more.you/

      Bahasa