PerfectVector
Oleh Irene Kim

Cara Membuat Logo Satu Warna Tanpa Kehilangan Desain

Ubah logo banyak warna menjadi satu warna solid sambil menjaga detail pentingnya. Gunakan ruang negatif, uji latar terang dan gelap, serta periksa versi kecil.

8 menit baca
Di halaman ini

Untuk membuat logo satu warna, beri desain yang terisi satu warna solid dan pertahankan detail internal penting sebagai ruang kosong bila diperlukan. Mengubah setiap fill menjadi hitam dapat menghilangkan simbol yang sebelumnya terlihat hanya karena warnanya berbeda.

Mulailah dengan master vektor yang disetujui atau varian satu warna yang sudah ada. Kerjakan salinan, tentukan detail yang harus bertahan, lalu periksa hasil pada lebih dari satu latar dan pada ukuran tampilan tujuannya. Contoh di bawah memakai lencana dan petir orisinal untuk memperlihatkan keputusan desain serta geometri SVG di baliknya.

Mulai dengan berkas logo yang disetujui

Minta aset satu warna kepada pemilik merek sebelum menggambar ulang logo. Merek mungkin sudah memiliki versi penuh warna, satu warna, dan versi putih terbalik yang masing-masing disetujui untuk latar tertentu.

Misalnya, panduan logo Penn State menjelaskan versi satu warna dengan area interior transparan dan memperingatkan agar tidak membuatnya dengan mengecat ulang varian lain. Itu aturan merek tertentu, tetapi menggambarkan alasan aset satu warna yang disediakan dapat berbeda dari master penuh warna.

Jika Anda pemilik desain dan perlu membuat variannya, kumpulkan masukan berikut:

  • Berkas asli yang tidak diubah dan salinan kerja yang dapat diedit
  • Daftar detail pengenal, misalnya simbol di dalam atau lubang huruf
  • Ukuran tampilan terkecil yang dituju dan kemungkinan warna latar
  • Format berkas dan persyaratan tinta yang diterima penerima, jika melibatkan pencetakan

SVG adalah berkas grafis vektor, tetapi dapat berisi gambar piksel alih-alih bentuk yang dapat diedit. Jika yang tersisa hanya PNG atau JPG, panduan vektorisasi logo menjelaskan tahap pemulihan sumber. Memulihkan bentuk dan merancang varian satu warna adalah keputusan terpisah.

Tentukan batas yang harus tetap ada

Bayangkan lencana lingkaran biru dengan petir kuning. Batas warna membuat petir terlihat. Memberi kedua bentuk fill arang yang sama akan menyisakan lingkaran polos: path masih ada, tetapi warna yang sama menyembunyikan perbedaan internalnya.

Ruang negatif adalah area tidak terisi yang memperlihatkan permukaan di balik desain. Menjadikan petir sebagai ruang negatif mempertahankan motif sementara lencana memakai satu warna terisi.

Detail pada versi asliKeputusan untuk versi satu warna
Simbol internal pentingPertahankan batasnya, mungkin sebagai bukaan kosong
Variasi warna dekoratifHilangkan jika desain tetap terbaca dengan benar
Lubang huruf atau celah antar elemenPertahankan pemisahan yang cukup agar tetap terlihat pada ukuran tujuan

Beberapa logo hanya memerlukan penggantian fill. Gunakan panduan pewarnaan ulang SVG untuk kasus itu. Jika Anda mempertahankan beberapa warna dan menggabungkan warna yang hampir sama, ikuti alur pengurangan palet terlebih dahulu.

Urutan konseptual dari lencana biru dengan petir kuning menjadi lingkaran arang polos, lalu lencana arang dengan motif petir kosong
Ilustrasi konseptual: menyamakan warna menyembunyikan petir; ruang negatif mempertahankan batasnya. Kode SVG di bawah merupakan contoh digital yang diperiksa secara terpisah.

Buat bukaan pada geometri SVG

Untuk contoh yang dapat direproduksi, simpan desain orisinal ini sebagai original.svg. Path adalah bentuk yang dijelaskan oleh instruksi gambar; berkas ini memiliki satu path tertutup untuk lencana dan satu lagi untuk petir.

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256">
  <path fill="#0d6efd"
    d="M128 24 A104 104 0 1 1 128 232 A104 104 0 1 1 128 24 Z"/>
  <path fill="#f5d447"
    d="M142 54 L88 142 H120 L110 202 L174 108 H138 Z"/>
</svg>
  1. Buka berkas asli di browser untuk melihat desain dua warna.
  2. Simpan salinan kedua dan ganti kedua nilai fill menjadi #111827. Buka kembali. Petir kini menyatu dengan lencana.
  3. Simpan kode revisi di bawah sebagai one-color.svg. Kode ini mempertahankan koordinat gambar yang sama, tetapi menaruh kedua garis luar dalam satu path.
  4. Buka berkas revisi pada latar terang dan gelap, lalu periksa pada ukuran tampilan yang dituju.
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256">
  <path fill="#111827" fill-rule="evenodd"
    d="M128 24 A104 104 0 1 1 128 232 A104 104 0 1 1 128 24 Z
       M142 54 L88 142 H120 L110 202 L174 108 H138 Z"/>
</svg>

fill-rule menentukan area di dalam path yang menerima warna. Dalam contoh bersarang ini, evenodd membiarkan area petir tidak terisi. Spesifikasi fill-rule SVG mendefinisikan perilaku ini. Berkas berisi satu fill solid tanpa bentuk putih di depan atau persegi panjang latar.

Anda juga dapat membuat bukaan semacam ini di editor vektor. Dokumentasi path gabungan Adobe menjelaskan area transparan dan aturan fill yang tersedia. Kode di sini adalah SVG buatan sendiri, bukan ekspor Illustrator; gunakan kontrol editor yang didokumentasikan dan buka kembali hasil tersimpan untuk memeriksa bukaannya.

Periksa latar dan versi kecil

Tempatkan logo revisi di atas latar putih serta latar gelap atau berwarna yang kontras. Petir seharusnya memperlihatkan setiap latar itu. Petir yang dicat putih akan tetap putih pada latar berwarna, meskipun tampak seperti bukaan pada latar putih.

Untuk contoh orisinal ini, kami merender berkas tersimpan pada 256 dan 32 piksel menggunakan Sharp dengan librsvg. Pada kedua ukuran, sampel interior petir revisi memiliki alpha 0, yang berarti sepenuhnya transparan. Kontrol warna seragam berwarna arang opak pada titik yang sama; kontrol overlay putih terpisah berwarna putih opak. Ini pemeriksaan digital berkas buatan, bukan hasil printer atau aplikasi pengimpor.

Pada tampilan 32 piksel sebenarnya, petir revisi tetap dapat dibedakan pada latar putih dan abu-abu kebiruan yang diperiksa. Ini menetapkan pemeriksaan yang berguna untuk contoh ini; tidak menetapkan ukuran minimum logo lain. Pratinjau desain Anda pada ukuran penggunaan sebenarnya, bukan hanya menilai kanvas yang diperbesar.

Sebelum menerima varian, pastikan:

  • Motif internal penting tetap terbaca sesuai maksud.
  • Area kosong memperlihatkan latar, bukan bidang yang dicat putih.
  • Celah kecil dan lubang huruf tetap terlihat pada ukuran pilihan.
  • Berkas tersimpan dapat dibuka kembali dengan geometri yang dimaksud dan satu warna solid.

Untuk versi putih terbalik dari contoh ini, ubah fill path revisi menjadi #ffffff dan pertahankan area petir kosong yang sama. Periksa pada latar gelap. Aset putih terbalik suatu merek dapat memerlukan geometri berbeda, jadi ikuti versi yang disediakan merek bila tersedia.

Perbaiki varian yang kehilangan detail

Yang Anda lihatYang perlu diubah
Simbol internal menghilang setelah pewarnaan ulangPulihkan batas dengan ruang negatif yang disengaja, atau gunakan varian satu warna yang disetujui
Bukaan yang dikira kosong tetap putih di atas permukaan berwarnaHapus overlay berwarna dan buat area kosong yang sebenarnya
Celah sulit terbaca pada ukuran pilihanPerlebar atau sederhanakan dalam aturan persetujuan desain, lalu ulangi pemeriksaan ukuran kecil
Bukaan terisi setelah diimpor ke aplikasi tujuanPeriksa path dan aturan fill hasil impor; buat ulang bukaan di sana bila perlu dan periksa kembali hasil tersimpan

Hindari mengubah setiap area berwarna menjadi lubang. Sorotan mungkin dapat dihilangkan, sedangkan lubang huruf membawa makna. Putuskan berdasarkan ciri pengenal desain, lalu bandingkan varian dengan versi asli. Jika Anda mengubah siluet atau proporsi internal secara berarti, mintalah persetujuan varian baru sebelum memakainya sebagai logo merek.

Pisahkan persyaratan penyerahan dari desain

Simpan master penuh warna, versi satu warna gelap, dan versi putih terbalik yang disetujui sebagai berkas terpisah. Pertahankan kanvas dan posisi yang sama jika semuanya dimaksudkan saling menggantikan dalam tata letak.

Satu fill SVG solid tidak memberi nama tinta spot percetakan atau membuat pelat produksi. Konfirmasikan nama warna yang diminta, ukuran fisik, jenis berkas yang diterima, dan asumsi latar kepada penerima. Panduan format berkas logo membahas pemilihan master yang dapat diedit dan format penyerahan. Topik persiapan logo lainnya dikumpulkan dalam panduan logo dan desain.

Jika sumber Anda hanya PNG atau JPG

Untuk logo raster tersisa yang sesuai, vektorisator logo PerfectVector dapat membantu memulihkan bentuk SVG. Pratinjaunya berupa tampilan raster yang dilindungi; pengeditan dan ekspor SVG sebenarnya tersedia setelah Anda membuka kunci hasil. Periksa bentuk yang dipulihkan sebelum memakainya untuk membuat varian satu warna.

Menjiplak piksel tidak menentukan detail mana yang harus menjadi ruang negatif. Jika sumber memiliki tepi kabur, bukaan hilang, atau tidak ada batas terlihat antara dua area, gunakan master yang disetujui atau gambar ulang bagian desain yang hilang dengan sengaja. Ulangi pemeriksaan latar dan ukuran kecil setelah perubahan geometri apa pun.

Tanya jawab

Apa itu logo satu warna?

Logo satu warna memakai satu warna solid yang terisi. Area kosongnya memperlihatkan latar. Versi gelap dan versi putih terbalik adalah varian terpisah, bukan dua warna yang digunakan bersama dalam logo yang sama.

Apakah cukup mengubah setiap fill menjadi hitam?

Kadang-kadang. Jika warna adalah satu-satunya batas antara simbol penting dan sekelilingnya, menyamakan fill menyembunyikan simbol itu. Pertahankan batas melalui ruang negatif atau gunakan aset satu warna yang disetujui.

Apakah saya perlu menjiplak logo yang sudah berupa desain vektor?

Tidak. Kerjakan bentuk yang sudah dapat diedit dan pertahankan versi asli. Penjiplakan adalah tahap pemulihan sumber untuk gambar piksel yang sesuai, bukan keharusan untuk membuat varian satu warna dari geometri vektor.

Apakah fill SVG putih otomatis menentukan tinta putih?

Tidak. Fill putih menjelaskan warna desain, sedangkan ruang kosong tidak terisi. Percetakan menentukan cara tinta putih harus diidentifikasi dan disediakan dalam alur produksinya.

Sumber

  1. Penn State: Warna dan Logo — Contoh merek tertentu dengan varian satu warna dan putih terbalik yang disetujui, termasuk area interior transparan.
  2. Adobe: Membuat path gabungan — Mendokumentasikan area transparan, aturan fill, dan arah path pada path gabungan Illustrator.
  3. W3C: fill-rule SVG 2 — Mendefinisikan area path gabungan yang menerima warna dalam contoh SVG asli ini.

Hanya memiliki PNG atau JPG? Konversikan logo menjadi SVG yang dapat diedit, buka kunci hasil, lalu periksa bentuk yang dipulihkan sebelum membuat dan memeriksa varian satu warna Anda.

Lebih banyak dari blog

PerfectVector

Ubah logo atau karya Anda menjadi
SVG yang rapi dan dapat diedit

Tanpa kartu kredit