Penjana Ikon Flat Dalam Talian: AppWeb Mudah yang mencipta ikon rata atau Flat

Saya akan mulakan dengan mengatakan sesuatu yang mungkin diketahui ramai ... tetapi tidak menjadi masalah: HTML5 + CSS3 + JS ... sempurna 🙂

Seorang pengguna menulis e-mel kepada saya mengenai tutorial untuk dia membuat ikon rata, yang rata dan itulah fesyen baru di web. Dikehendaki khas oleh Inkscape o Gimp butang gaya sembang atau sesuatu yang berfungsi (atau rujukan) Snapchat.

Kerana saya sangat teruk dengan Inkscape dan juga, membuat kandungan dari awal walaupun dengan Gimp menyebalkan ... Saya teringat bahawa beberapa ketika lalu saya melihat aplikasi web kecil (sebuah index.html dengan beberapa css dan js) yang membolehkan kami membuat ikon rata dengan mudah dan pantas mengikut fesyen semasa, anda tahu, Reka bentuk rata.

Penjana Ikon Flat

penjana ikon dalam talian-rata

Ia mempunyai rangkaian ikon yang telah ditetapkan, contohnya ikon Laptop, peranti mudah alih (yang saya tunjukkan dalam tangkapan skrin), hadiah, basikal ... jika tidak, mereka cukup banyak, sungguh pelbagai:

dalam talian-flat-icon-generator-ikon

Tetapi bukan hanya meletakkan ikon dan sekarang ... kita dapat menentukan ukuran ikon atau ukuran gambar seperti itu (ikon + latar belakang) dengan menggunakan dua bar mendatar. Jelas sekali kita melihat ukuran persegi dalam piksel ... 256 ... 512 ... dll

Pilihan seterusnya membolehkan kita memilih warna latar dan juga warna ikon. Secara lalai ikonnya berwarna putih dan latar belakang berwarna biru, sehingga tidak banyak berbenturan.

Akhirnya, di bar di sebelah kiri pilihan, ia membolehkan kita menentukan sama ada sempadan ikon itu persegi atau jika, sebaliknya, kita mahu hasil akhir menjadi bulat.

Saya memberikan tangkapan skrin mengenai pilihan ini:

pilihan dalam talian-rata-ikon-penjana-pilihan

Sebaliknya, di bahagian atas ia menunjukkan kepada kita maklumat ikon yang dihasilkan dan berubah dalam masa nyata. Maksudnya, jika anda bermain-main dengan ukuran dan warna, anda akan melihat bahawa maklumat ini selalu berubah dalam masa nyata:

atas talian-rata-ikon-penjana-atas

Seperti yang anda lihat, kami juga mempunyai butang Dapatkan Ikon, yang akan menunjukkan kepada kita ikon yang sudah dihasilkan dalam PNG di tab lain, di mana kita dapat mengklik kanan + Simpan dan voila, kita akan mempunyai ikon rata yang kita hasilkan di folder yang diinginkan di komputer kita.

Muat turun Penjana Ikon Flat

Sekiranya anda ingin mencubanya sendiri (yang saya bayangkan jadi haha), berikut adalah pautan:

Penjana Ikon Flat

Dengan ini saya berharap dapat mematuhi apa yang diminta oleh pengguna melalui e-mel, walaupun bukan tutorial untuk membuat butang dengan Gimp atau Inkscape, saya masih membayangkan bahawa ia akan melayani apa yang anda mahukan. Sebenarnya, anda tidak boleh hanya menghasilkan butang untuk pautan dari muat turun snapchat, tetapi boleh menghasilkan sebahagian besar ikon atau butang untuk laman web anda, atau apa sahaja yang anda lakukan 😀

Salam dan saya harap anda menganggapnya menarik.


Tinggalkan komen anda

Alamat email anda tidak akan disiarkan. Ruangan yang diperlukan ditanda dengan *

*

*

  1. Bertanggungjawab atas data: Miguel Ángel Gatón
  2. Tujuan data: Mengendalikan SPAM, pengurusan komen.
  3. Perundangan: Persetujuan anda
  4. Komunikasi data: Data tidak akan disampaikan kepada pihak ketiga kecuali dengan kewajiban hukum.
  5. Penyimpanan data: Pangkalan data yang dihoskan oleh Occentus Networks (EU)
  6. Hak: Pada bila-bila masa anda boleh menghadkan, memulihkan dan menghapus maklumat anda.

  1.   illukki kata

    Saya tidak faham bagaimana menggunakannya Pueden Bolehkah anda hanya membuat pilihan ikon yang diberikannya?

  2.   Percaff_TI99 kata

    Ia sangat baik, saya menulis pautan.
    Saya biasanya menggunakan Aplikasi IcoMoon (https://icomoon.io/app/#/select) yang juga cukup menarik dan sangat lengkap; walaupun saya tidak tahu sama ada ia sama dengan yang dimaksudkan oleh jawatan itu.

    Greetings.

  3.   mat1986 kata

    Saya menyukai idea menyesuaikan ikon, saya menyukai pautan (milik anda dan pengguna Percaff_TI99). Saya akan menyimpannya dalam kegemaran saya 😀

  4.   eliotime3000 kata

    Cadangan menarik, walaupun saya lebih suka menggunakan Inkscape kerana betapa mudahnya membuat ikon rata (sebenarnya, lebih praktikal daripada editor vektor lain yang saya gunakan, walaupun saya belum terbiasa membuat grafik vektor yang lebih maju dengan aplikasi itu).

  5.   Ivan Garcia kata

    Sangat praktikal dan senang digunakan. Anda juga dapat memenuhi keperluan tersebut dengan menggunakan Font Awesome: http://fortawesome.github.io/Font-Awesome/

    1.    Sergio kata

      Terima kasih kerana sudi berkongsi! bahawa 🙂

  6.   Sergio kata

    Pergi yang menarik pasti akan berfungsi untuk banyak projek. Saya tertanya-tanya seperti apa aplikasi web, bolehkah ia dibawa ke os firefox? Membuat webapp jalan pintas langsung atau serupa dengan menggunakannya? Maaf, saya tidak tahu mengapa saya bertanya.

  7.   Ann kata

    Sekarang ketika kita berada di Krismas, banyak ibu bapa akan memberikan anak mereka telefon pintar untuk raja. Apakah perkara pertama yang akan anda lakukan dengan peranti ini? Tanpa keraguan, salah satunya, jika bukan yang pertama, akan memuat turun snapchat dan yang lain adalah penerangan mengenai whatsapp. Oleh kerana ini adalah aplikasi percuma, kebanyakan remaja memilikinya di telefon mereka.

  8.   Sergio kata

    Saya berpendapat bahawa salah satu penyebab kejayaan aplikasi jenis snapchat adalah pertama sekali bahawa mereka bebas, sebaliknya fesyen telah diciptakan untuk menghantar gambar hampir semua yang dilakukan sepanjang hari dan akhirnya kerana ia mengenai aplikasi yang sangat mudah digunakan

  9.   Dunia Snapchat kata

    Hebat! Laman web ini banyak membantu saya dalam proses membuat logo untuk laman web baru saya di snapchat, bertepatan dengan pengguna yang membuat pertanyaan. Saya menghantar pelukan kepada anda dari Paraguay, laman web ini sangat baik 😉 Salam.