Ultramodern UI/UX
Tasarım Sistemi

Bootstrap 5 + Tailwind CSS ile geliştirilmiş, responsive, modern ve erişilebilir tasarım komponenti kütüphanesi. Dark/Light mode desteği ve micro-interactions ile zenginleştirilmiş.

Tipografi

Temel Tipler

Display Başlık

text-display - 3.5rem / 700 weight

Headline Başlık

text-headline - 2.25rem / 600 weight

Başlık

text-title - 1.5rem / 600 weight

Normal metin

text-body - 1rem / 400 weight

Alt Metin

text-overline - 0.75rem / 600 weight

Renk Paleti

Primary
Secondary
Success
Warning
Error

UI Componentleri

Butonlar

Varyantlar

Boyutlar

Icon Butonlar

Güvenli

En yüksek güvenlik standartları ile korunan verileriniz.

Yükseltilmiş Kart

Bu kart yükseltilmiş gölge efekti ve hover animasyonu içerir.

Hızlı

Optimize edilmiş performans ile ultra hızlı yükleme.

Genel Bilgiler

Bu tab içeriği dinamik olarak yüklenen içerik örneğidir. JavaScript ile tab geçişleri sağlanmaktadır.

Detaylı Bilgiler

Detaylı bilgiler ve açıklamalar burada gösterilir.

Sistem Ayarları

Konfigürasyon ve sistem ayarları bu alanda bulunur.

SSS - Sıkça Sorulan Sorular

Tasarım sistemi, UI komponentleri, stil rehberi ve tasarım dili kurallarının birlikte oluşturduğu standart bir yapıdır.

Dark mode, CSS değişkenleri (custom properties) kullanılarak tüm renk şemasının dinamik olarak değiştirilmesi ile sağlanır.

Responsive Grid Sistemi

12 Kolonlu Grid

1
1
1
1
1
1
1
1
1
1
1
1

8 Kolon (Ana İçerik)

Ana içerik alanı. Responsive tasarım ile farklı ekran boyutlarında otomatik olarak ayarlanır.

4 Kolon (Sidebar)

Yan panel veya yardımcı içerikler için kullanılır.

3 Kolon

Large screens: 3 kolon

3 Kolon

Medium screens: 6 kolon

3 Kolon

Mobile: Tam genişlik

3 Kolon

Responsive breakpoint'ler

Form Componentleri

Standart Form

Floating Label Form

Animasyonlar & Micro-interactions

Hover Lift

Kart üzerine gelince yukarı hareket eder.

Hover Scale

Kart üzerine gelince ölçeklenir.

Hover Glow

Kart çevresinde parlama efekti.