Voice framework, visual identity standards, color palette management, typography specs, brand consistency
Marka kimligini olusturma ve koruma rehberi. Tutarlilik her seydir.
| Kavram | Tanim | Ornek |
|---|---|---|
| Voice | Markanin kalici kisilik ozellikleri | "Profesyonel ama samimi" |
| Tone | Duruma gore degisen ifade bicimi | Hata mesajinda: empatik, basaride: kutlamaci |
Markanin 4 eksenini tanimla:
| Eksen | Sol Uc | Sag Uc | Senin Pozisyon (1-5) |
|---|---|---|---|
| Formalite | Resmi, kurumsal | Samimi, konusma dili | ? |
| Enerji | Sakin, olculu | Heyecanli, enerjik | ? |
| Mizah | Ciddi, agirbasli | Eglenceli, espirili |
| ? |
| Teknik | Basit, herkes icin | Uzman, teknik dil | ? |
| Kural | Detay |
|---|---|
| Clear space | Logo etrafinda min logo yuksekligi kadar bosluk |
| Min boyut | Dijitalde min 24px yukseklik |
| Arka plan | Hangi renklerde kullanilabilir, hangilerinde degil |
| Varyasyonlar | Full color, monochrome, reversed (dark bg) |
| Yasaklar | Stretch etme, renk degistirme, efekt ekleme |
LAYER 1: Primitive (Ham renkler)
blue-500: #3b82f6
blue-600: #2563eb
gray-100: #f3f4f6
LAYER 2: Semantic (Anlam tasiyan)
color-primary: {blue-600}
color-danger: {red-600}
color-surface: {white}
color-text: {gray-900}
LAYER 3: Component (Kullanim yeri)
button-primary-bg: {color-primary}
button-primary-hover: {blue-700}
card-bg: {color-surface}
input-border: {gray-300}
| Kural | Detay |
|---|---|
| Ana renkler | Max 3 (primary, secondary, accent) |
| Notral tonlar | 1 gray skalasi (50-950) |
| Durum renkleri | Success (yesil), Warning (sari), Danger (kirmizi), Info (mavi) |
| Dark mode | Her semantic token'in dark varyanti |
| Kontrast | Tum text/bg kombinasyonlari WCAG AA (4.5:1) |
| Kullanim | Font | Agirlik | Boyut | Satir Yuksekligi |
|---|---|---|---|---|
| Display | Primary | Bold (700) | 48-72px | 1.1 |
| H1 | Primary | Semibold (600) | 36-48px | 1.2 |
| H2 | Primary | Semibold (600) | 24-36px | 1.25 |
| H3 | Primary | Medium (500) | 20-24px | 1.3 |
| Body | Primary | Regular (400) | 16px | 1.5 |
| Small | Primary | Regular (400) | 14px | 1.4 |
| Caption | Primary | Regular (400) | 12px | 1.3 |
| Code | Mono | Regular (400) | 14px | 1.5 |
| Baslik | Govde | Karakter |
|---|---|---|
| Inter | Inter | Notr, profesyonel |
| Cal Sans | Inter | Modern, teknoloji |
| Playfair Display | Source Sans | Luks, editoryal |
| Space Grotesk | DM Sans | Yaratici, modern |
| Fraunces | Work Sans | Sicak, organik |
| Kural | Detay |
|---|---|
| Stil tutarliligi | Tek icon seti sec (Lucide, Heroicons, Phosphor) |
| Boyut skalasi | 16, 20, 24, 32px (text ile orantili) |
| Cizgi kalinligi | Set icinde tutarli (1.5px veya 2px) |
| Filled vs Outlined | Birini sec, karistirma |