Web Geliştiriciler için 10 harika kaynak🪄 | html, css , js 💻

Bu yazıda web geliştiricilerin her alanda işine yarayacak harika web siteleri ve araçları derledim. Web tasarımından CSS’e yardımcı araçlara kadar bir çok aracı bulabilirsiniz. Başlayalım

Css Gradient Oluşturma Aracı

Bu araç sayesinde renk geçişli css arkaplanı oluşturabilirsiniz. Oluşturduğunuz renk geçişini hem canlı olarak gösteriyor hem de css kodunu hazırlıyor.

https://cssgradient.io

css gradient aracı

Haikei – harika svg görseller oluşturma aracı

Bu araç gerçekten sevdiğim bir araç. Svg veya png olarak dalga, arkaplan gibi yumuşak geçişli görseller oluşturma imkanı sağlıyor. Ücretsiz ve svg|png çıktı verebiliyor.

Soldan oluşturmak istediğiniz görsel tasarımını seçiyorsunuz, sağda ise ince ayarlar ve indirme menüsü var.

https://app.haikei.app

haikei svg oluşturucu

Svg arkaplan üretici

Yine Haikei gibi bir svg üretici ama daha çok tekrar eden tasarımlar kullanıyor. Böylelikle arkaplan olarak kullanılabilir görseller üretiyor. Ücretli ve ücretsiz arkaplan seçenekleri var

https://www.svgbackgrounds.com/

svg arkaplan

Hazır HTML tasarımları | Quackit

Bu websitesinde hazır HTML templateleri bulunuyor. İçinde basit tasarımlardan iş web sitesi için kullanılabilecek tasarımlar var.

Flexbox, grid, bootstrap gibi tasarım dili belli olan template’ler de bulunuyor.

https://www.quackit.com/html/templates

hazır html template

Ücretsiz Icon sitesi – Flaticon

Flaticon harika bir icon sitesi, aradığın her icon’u ücretsiz bulabileceğin bir site. Yalnız icon’ların lisansı için kaynağını belirtmeniz gerekli

https://www.flaticon.com/

ücretsiz icon sitesi flaticon

Tailwindcss Gradient kodu oluşturma eklentisi

Bu eklenti bizzat benim kendi eklentim 😊. Canlı olarak tailwindcss’in kendi hazır renkleri ile css gradient geçişi oluşturup kodu kopyalayabilirsiniz. Chromium eklentisi olduğu için bir websitesi yok, tarayıcınıza eklemeniz gerekli.

Tailwindcss gradient seçici eklenti

tailwindcss gradient seçici eklenti

CDN.js – Online js kütüphane API

Eğer web geliştirdiyseniz node.js ve npm’i biliyorsunuzdur. Fakat CDN.js paketleri bilgisayarınıza indirmeden bulut üzerinden kullanmanızı sağlıyor.

Böylelikle basit html projelerinizde npm olmadan kütüphane kullanabilirsiniz. Ayrıca kütüphaneyi sunucunuzda saklamanıza gerek yok.

https://cdnjs.com

cdn.js bulut kütüphane sitesi

Ücretsiz görseller – Unsplash

Unsplash ücretsiz görsel işinde lider. Direkt olarak ücretsiz ve üstünde logosuz stok foto vb. binlerce görsel bulabilirsiniz. Lisans için görselin kaynağını belirtmeniz gerekebilir.

https://unsplash.com/

unsplash ücretsiz foto

Tailwindcss UI kütüphanesi – Shadcnui

Shadcn ui son zamanlarda popülerlik kazanan bir tailwindcss kütüphanesi. Shadcn sayesinde tüm web sitenizde tutarlı bir tasarımı kolayca oluşturabilirsiniz.

https://ui.shadcn.com/themes

shadcn ui tailwindcss kütüphanesi

Codepen – Web tabanlı web düzenleyici

Codepen ile tarayıcınızda web projeleri oluşturup önizlemesine bakabilirsiniz. Ayrıca hesap açıp kayıt etme özelliği de var.

https://codepen.io/

codepen tarayıcı tabanlı web dev platformu

Yorum bırakın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

Scroll to Top