warnakan semula SVG

Penukar Warna SVG

Setiap warna dalam fail, dikumpulkan ke dalam satu palet — sunting mana-mana dan lihat hasilnya serta-merta, atau serahkan kesemuanya kepada CSS dengan currentColor.

warnakan semula SVG

☞ berjalan sepenuhnya dalam pelayar anda — tiada apa-apa dimuat naik

Lepaskan SVG anda di sini

atau klik untuk pilih — SVG sahaja

satu palet, semua warna

Di mana warna bersembunyi dalam sesuatu SVG

Sesuatu warna boleh berada pada atribut fill atau stroke, di dalam style dalaman, atau dalam helaian gaya yang terbenam dalam fail — dan eksport daripada Illustrator atau Figma lazimnya memilih yang terakhir. Itulah sebabnya menyunting SVG secara manual dalam penyunting teks begitu kerap terlepas beberapa bentuk.

Alat ini membaca ketiga-tiga tempat itu, ditambah hentian kecerunan dan warna penapis, lalu mengumpulkannya ke dalam satu palet. Tukar satu swatch dan setiap kemunculan warna itu turut bertukar, di mana jua ia ditulis.

tiga langkah

Cara menukar warna dalam sesuatu SVG

01

Lepaskan SVG

Pilih fail .svg — ia kekal pada peranti anda.

02

Sunting satu swatch

Setiap warna dalam fail mendapat satu, lengkap dengan berapa kerap ia digunakan.

03

Muat turun

Hanya warnanya berubah; bentuknya tidak disentuh.

jawapan pantas

Soalan lazim penukar warna SVG

Apa sebenarnya yang currentColor lakukan?

Ia memberitahu bentuk itu supaya menggunakan warna teks elemen tempat ia berada. Ikon yang ditetapkan kepada currentColor bertukar putih di dalam butang gelap dan kelabu di dalam teks yang malap, tanpa fail kedua mahupun satu peraturan CSS tambahan. Itulah cara standard pustaka ikon mengedarkan SVG.

Kenapa saya tidak boleh menyunting kecerunan itu?

Kecerunan ialah rujukan kepada satu takrifan di tempat lain dalam fail, bukan satu warna, jadi menggantikannya akan memadam kecerunan itu dan bukan mewarnakannya semula. Warna hentian individu di dalam kecerunan itu memang muncul dalam palet — suntinglah yang itu.

Paletnya kosong

Bermakna fail itu tiada warnanya sendiri. Lazimnya itu bermaksud karya itu sudah ditetapkan kepada currentColor atau mewarisi warnanya daripada helaian gaya di luar fail. Buka dalam pemapar SVG untuk melihat sumbernya.

Dua warna yang nampak serupa berkongsi satu swatch

Warna dikumpulkan mengikut nilai sebenarnya, jadi #FFF, #ffffff dan white ialah satu entri. Menyuntingnya akan mengemas kini kesemuanya, masing-masing dalam bentuk tulisan asalnya.

Adakah fail saya dimuat naik?

Tidak. Fail itu dihurai dan ditulis semula dalam pelayar anda.