Çevrimiçi Düz Simge Oluşturucu: Düz veya Düz simgeler oluşturan basit AppWeb

Pek çok kişinin bilebileceği bir şey söyleyerek başlayacağım ... ama önemi yok: HTML5 + CSS3 + JS ... sadece mükemmel 🙂

Bir kullanıcı bana, düz simgeler, yani düz ve web'deki yeni moda yaratması için bir eğitim hakkında bana soran bir e-posta yazdı. Özellikle isteyen Inkscape o kaytan sohbet tarzı bir düğme veya hizmet edecek (veya referans verecek) bir şey Snapchat.

Inkscape ile berbat olduğumdan ve ayrıca Gimp ile bile sıfırdan içerik oluşturmak berbat ... Bir süre önce küçük bir web uygulaması gördüğümü hatırladım (bazı css ve js içeren bir index.html) bu, günümüz modasına göre kolayca ve hızlı bir şekilde düz simgeler oluşturmamızı sağladı, Düz tasarımlar.

Düz Simge Oluşturucu

çevrimiçi düz simge oluşturucu

Bir dizi önceden tanımlanmış simgeye sahiptir, örneğin Dizüstü bilgisayar simgesi, mobil cihazlar (ekran görüntüsünde gösterdiğim), hediye, bisiklet ... uff, bunlar oldukça çok, gerçekten çok çeşitli:

online-flat-icon-generator-simgeler

Ancak mesele sadece simgeyi koymak değil ve şimdi ... ikonun boyutunu veya görüntünün boyutunu (simge + arka plan) iki yatay çubuk aracılığıyla tanımlayabiliriz. Açıkçası kare boyutunu piksel olarak görüyoruz… 256… 512… vb.

Bir sonraki seçenek, arka plan rengini ve simgenin rengini seçmemize olanak tanır. Varsayılan olarak, simge beyaz ve arka plan mavidir, bu nedenle fazla çakışmaz.

Son olarak, seçeneklerin solundaki bu çubukta, simgenin kenarlıklarının kare mi yoksa diğer yandan nihai sonucun dairesel mi olmasını istediğimizi belirlememizi sağlar.

Size bu seçeneklerin bir ekran görüntüsünü bırakıyorum:

çevrimiçi-düz-simge-oluşturucu-seçenekleri

Üst kısımda ise gerçek zamanlı olarak üretilen ve değişen ikona ait bilgileri gösteriyor. Yani, boyutlar ve renklerle oynarsanız, bu bilgilerin her zaman gerçek zamanlı olarak değiştiğini göreceksiniz:

çevrimiçi-düz-simge-oluşturucu-üst

Gördüğünüz gibi, bir de düğmemiz var Simge Al, bize PNG'de zaten oluşturulmuş olan simgeyi sağ tıklayıp + Kaydet ve işte kullanabileceğimiz başka bir sekmede gösterir, bilgisayarımızda istenen klasörde oluşturduğumuz düz simgeye sahip olacağız.

Flat Icon Generator'ü İndirin

Kendiniz denemek istiyorsanız (ki haha ​​da öyle olsun), işte bağlantı:

Düz Simge Oluşturucu

Bununla, kullanıcının bana e-posta yoluyla sorduğu şeye uymayı umuyorum, ancak bu, Gimp veya Inkscape ile düğmeyi oluşturmak için bir eğitim olmasa da, yine de istediğiniz şeye hizmet edeceğini hayal ediyorum. Aslında, bağlantı için bir düğme oluşturamazsınız. Snapchat'i indir, ancak siteniz veya ne yapıyor olursanız olun için simgelerin veya düğmelerin büyük çoğunluğunu oluşturabilir 😀

Selamlar ve umarım bunu ilginç bulmuşsundur.


Yorumunuzu bırakın

E-posta hesabınız yayınlanmayacak. Gerekli alanlar ile işaretlenmiştir *

*

*

  1. Verilerden sorumlu: Miguel Ángel Gatón
  2. Verilerin amacı: Kontrol SPAM, yorum yönetimi.
  3. Meşruiyet: Onayınız
  4. Verilerin iletilmesi: Veriler, yasal zorunluluk dışında üçüncü kişilere iletilmeyecektir.
  5. Veri depolama: Occentus Networks (AB) tarafından barındırılan veritabanı
  6. Haklar: Bilgilerinizi istediğiniz zaman sınırlayabilir, kurtarabilir ve silebilirsiniz.

  1.   Illukki dijo

    Nasıl kullanacağımı anlamadım pueden Sadece onun verdiği ikon seçeneklerini yapabilir misin?

  2.   Percaff_TI99 dijo

    Çok güzel, link yazıyorum.
    Genellikle IcoMoon Uygulamasını kullanıyorum (https://icomoon.io/app/#/select) bu da oldukça ilginç ve eksiksiz; Yazının atıfta bulunduğu ile tam olarak aynı olup olmadığını bilmeme rağmen.

    Selamlar.

  3.   mat1986 dijo

    Simgeleri özelleştirme fikrini beğendim, bağlantıları beğendim (sizinki ve Percaff_TI99 kullanıcısı). Onları favorilerime kaydedeceğim 😀

  4.   eliotime3000 dijo

    İlginç öneriler, düz simgeler yapmanın ne kadar kolay olmasından dolayı zaten Inkscape'i kullanmayı tercih etsem de (aslında, daha gelişmiş vektör grafikleri yapmaya alışmama rağmen, kullandığım başka bir vektör düzenleyiciden daha pratiktir. bu uygulama ile).

  5.   Ivan Garcia dijo

    Çok pratik ve kullanımı kolaydır. Font Awesome'i kullanarak bu ihtiyaçları da karşılayabilirsiniz: http://fortawesome.github.io/Font-Awesome/

    1.    Sergio dijo

      Paylaşım için teşekkürler! bu 🙂

  6.   Sergio dijo

    Pek çok projeye hizmet edeceğinden emin olun ki o kadar ilginç olun. Bir web uygulamasının neye benzediğini merak ediyordum, firefox işletim sistemi için taşınabilir mi? Bir web uygulamasını kullanmak için doğrudan bir kısayol veya benzeri bir uygulama mı oluşturuyorsunuz? Affedersiniz, neden bilmiyorum.

  7.   Ana dijo

    Artık Noel'de olduğumuza göre, birçok ebeveyn çocuklarına krallar için bir akıllı telefon verecek. Bu cihazlarla yapacağınız ilk şeylerden biri nedir? Şüphesiz, bunlardan biri, ilki değilse, snapchat'i indirecek ve bir diğeri whatsapp'ın açıklaması olacak. Bunlar ücretsiz uygulamalar olduğundan, çoğu genç bunları telefonlarında bulundurur.

  8.   Sergio dijo

    Snapchat türündeki uygulamaların başarı nedenlerinden birinin ilk etapta özgür olmaları olduğunu düşünüyorum, diğer yandan modanın gün içinde yapılan hemen hemen her şeyin imajını göndermek için yaratılmış olması ve son olarak, kullanımı çok kolay bir uygulama olduğu için

  9.   Snapchat dünyası dijo

    Mükemmel! Bu web sitesi, sorguyu yapan kullanıcıyla aynı zamana denk gelen snapchat'te yeni sitem için logo oluşturma sürecinde bana çok yardımcı oldu. Sana Paraguay'dan sarıldım, site çok güzel 😉 Selamlar.