Lewati ke konten
Logo CrateX.app

CrateX.app​

Pemilih Warna Gambar & Palet

Pilih warna dari satu gambar di browser, salin HEX/RGB/CSS, ekstrak palet representatif 2-32 warna, lalu ekspor variabel CSS atau JSON dengan dukungan HEIC/HEIF.

Seret dan lepas gambar di sini atau klik untuk memilih

Mendukung PNG / JPEG / WebP / AVIF / HEIC / HEIF

Jumlah file

0 / 1

Ukuran total

0 bytes / 25 MB

Batas per file

25 MB
Pemilih Warna Gambar & Palet

Mulai cepat

1
Impor satu gambar
2
Klik pratinjau dan salin HEX/RGB/CSS
3
Pilih ukuran palet (4/6/8/12/16/24/32)
4
Ekstrak warna representatif
5
Ekspor variabel CSS atau JSON

Skenario umum

Pemilihan warna desain/poster

Ekstrak warna primer dan aksen untuk skema warna

Tema/sistem desain

Ekspor variabel CSS atau JSON untuk proyek

Styling komponen

Ekstrak warna yang cocok untuk tombol, tag, grafik

Konsistensi merek

Ekstrak palet warna standar dari aset merek

Opsi Pemilih Warna & Palet

Jumlah warna: 2-32, biasanya 8/12; foto/gradien menyarankan 16-32
Tombol preset: 4/6/8/12/16/24/32 ganti satu klik
Penyortiran: Berdasarkan jumlah sampel terkuantisasi dari tinggi ke rendah, warna paling umum terlebih dahulu
Nomor di sebelah warna: Menampilkan jumlah sampel terkuantisasi dari gambar palet yang didownsampling
Kontrak ekspor: Variabel CSS menggunakan nama:root --color-1; JSON mencantumkan indeks/hex/css/rgb/count untuk setiap warna palet.

Saran penggunaan

Mulai dengan 8/12 untuk melihat efek keseluruhan, lalu tingkatkan ke 16/24/32 sesuai kebutuhan
Saat menggunakan di proyek, ganti nama --color-1 menjadi nama semantik (misal, --color-primary)
Jaga halaman di depan saat mengekstrak gambar besar untuk menghindari throttling browser

Batasan & kompatibilitas

Ekstraksi palet diturunkan secara otomatis untuk kinerja, hasilnya adalah warna yang representatif.
Presisi: pengambilan sampel klik menggunakan kanvas yang ditampilkan hingga 2.048 piksel pada sisi terpanjang; ekstraksi palet menggunakan sampel 256 px.
HEIC/HEIF hanya dimasukkan; decoding lokal mungkin gagal, jadi konversikan ke PNG/JPEG jika diperlukan.
Penanganan alfa: CSS dapat menghasilkan rgba(...);HEX/RGB tidak menyertakan alfa; JSON mempertahankan alpha melalui nilai css.
Batas masukan: tidak ada impor URL, impor tempel, pipet layar, atau alur kerja ekstensi browser.
Batas warna: tidak ada konversi HSL/CMYK/Pantone/LAB/OKLCH, pemeriksa kontras, atau matriks WCAG.
Batas ekspor: tidak ada ekspor swatch Tailwind/SCSS/ASE/Figma/Procreate.

Privasi & keamanan

Pemilihan warna gambar dan ekstraksi palet berjalan di browser. Gambar sumber tetap berada di memori halaman selama alat ini terbuka. Pengaturan ukuran palet dapat tetap berada di penyimpanan browser; jika sinkronisasi WebDAV diaktifkan, pengaturan itu dapat disinkronkan sesuai pengaturan Anda. Warna terpilih, palet, pesan error, serta data zoom/geser pratinjau adalah status tinjauan runtime dan juga dapat disinkronkan melalui WebDAV state schema selama masih ada. File gambar tidak disinkronkan secara default; file itu hanya masuk ke sinkronisasi lampiran WebDAV jika Anda mengaktifkan sinkronisasi lampiran secara eksplisit. Ekspor palet CSS/JSON dibuat saat diunduh dan tidak disimpan sebagai hasil terpisah. Di perangkat bersama, bersihkan gambar, warna terpilih, palet, pengaturan tersimpan, dan data situs bila perlu.

Pertanyaan umum

5

Lanjutkan langkah berikutnya dengan alat terkait ini.

Tentang

Tentang kami
Harga

Legal​

Ketentuan
Kebijakan privasi
Kebijakan cookie

Preferensi

Kelola Cookie

Seluruh pemrosesan alat terjadi secara lokal di browser Anda.