Ana içeriğe geç
Uddatak

CSS Grid ve Flexbox Düzen Oluşturucu

Grid ve Flexbox arasında geçiş yapın, sütun ve satır sayısını veya flex öğelerinin yönünü ve hizalamasını ve aralarındaki boşluğu ayarlayın, kapsayıcı içindeki renkli kutuların canlı önizlemesiyle, ardından tam CSS kodunu kopyalayın.

Tasarım ve CSS Araçları Tamamen tarayıcınızda çalışır

Tüm işlemler cihazınızda gerçekleşir — hiçbir şey sunucuya gönderilmez.

1
2
3
4
5
6

CSS kodu

display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(2, 1fr);
gap: 12px;

Bununla devam edin

Tamamen yerel

CSS Clip-Path Oluşturucu

Hazır bir şekil seçin (daire, üçgen, yıldız, mesaj balonu...) ve clip-path CSS kodunu kopyalayın.

Tasarım ve CSS AraçlarıAracı aç
Tamamen yerel

Cubic Bezier Hızlanma Eğrisi Oluşturucu

Özel bir hareket hızlanma eğrisi tasarlamak için iki noktayı sürükleyin ve cubic-bezier kodunu kopyalayın.

Tasarım ve CSS AraçlarıAracı aç
Tamamen yerel

CSS Glassmorphism Oluşturucu

Buzlu cam kart efektini görsel olarak tasarlayın ve hazır CSS kodunu kopyalayın.

Tasarım ve CSS AraçlarıAracı aç

İlgili araçlar

Tamamen yerel

Metni El Yazısına Dönüştürücü

Yazılan metni çizgili kağıt üzerinde el yazısıyla yazılmış gibi görünen bir görsele dönüştürün, birden fazla el yazısı stiliyle.

Tasarım ve CSS AraçlarıAracı aç
Tamamen yerel

SVG Blob ve Arka Plan Deseni Oluşturucu

Rastgele organik bir blob şekli veya SVG olarak sorunsuz tekrarlayan bir arka plan deseni oluşturun ve kopyalayın veya indirin.

Tasarım ve CSS AraçlarıAracı aç
Tamamen yerel

CSS Keyframe Animasyon Oluşturucu

Bir CSS animasyonunu görsel olarak tasarlayın (belirme, kayma, yakınlaştırma, zıplama, döndürme, çevirme) ve kullanıma hazır @keyframes kodu alın.

Tasarım ve CSS AraçlarıAracı aç
Tamamen yerel

Renk Paleti Uyum Oluşturucu

Bir ana renk seçin ve uyumlu bir renk paleti elde edin (tamamlayıcı, benzer, üçlü, dörtlü, tek renkli).

Tasarım ve CSS AraçlarıAracı aç
Tamamen yerel

Mesh Gradyan Oluşturucu

Tek tıkla yumuşak, çok noktalı bir mesh gradyan arka planı oluşturun ve kullanıma hazır CSS kodunu kopyalayın.

Tasarım ve CSS AraçlarıAracı aç

Uddatak'i denemeye hazır mısınız?

Tüm araç kütüphanesine göz atın ve ihtiyacınız olanı hemen şimdi kullanmaya başlayın — ücretsiz, kayıt gerekmez.

Tüm araçlara göz atın