Frontend & Arayüz
design-skills · Editorial
Katı bir 8pt ızgarada Gelasio serif ile dergi düzeni.
Nedir
Modern bir editoryal görünüm için bir tasarım sistemi kılavuz skill’i: hem gövde hem başlık için Gelasio serif, Ubuntu Mono, beyaz yüzeylerde neredeyse siyah #111111 ve bir 8pt taban ızgarası.
Magazine-inspired editorial layout with refined serif typography, structured grids, and elegant reading experiences.
Tasarım için neden önemli
- Tek bir aileden serif başlık ve gövde, uzun okuma bölümlerini tipografik olarak tutarlı tutar.
- Bir 8pt taban ızgarası; başlıklar, gövde metni ve boşluk boyunca dikey ritmi zorunlu kılar.
- Erişilebilirlik çıtası; reduced-motion desteğini, 44px dokunma hedeflerini ve yüksek kontrast yönetimini içerir.
Neleri kapsıyor
- Style foundations
- Accessibility
- Guideline authoring workflow
- Required output structure
- Component rule expectations
- Quality gates
Nasıl kurulur
design-skills · Editorial
-
Depoyu klonlayın.
git clone https://github.com/bergside/awesome-design-skills -
Codex’i skill dosyasına yönlendirin.
skills/editorial/SKILL.md -
Sonra istediğiniz arayüzü anlatın. Codex skill’e uyar.
Codex ile nasıl çalıştırılır
-
Codex’ten tasarım niyetini yeniden ifade etmesini, sonra bileşenlere dokunmadan önce token’ları tanımlamasını isteyin.
-
Anatomiyi, varyantları, durumları ve responsive davranışı kapsayan bileşen kuralları isteyin.
-
Bir kod incelemecisinin çıktıyı doğrulayabilmesi için QA kontrol listesiyle kapatın.
Buradaki her eklenti ücretsiz, açık kaynak ve gerçek üst kaynağına bağlantı veriyor.
codex-design listesinde dahası ↗Diğer Codex tasarım eklentileri
Frontend & Arayüz Ne yapar gpt-taste GSAP scroll hareketi ve boşluksuz bento ızgaralarıyla ödüllük tarzda landing page’ler kurar. 
Tasarım Sistemleri Ne yapar Stitch Design Taste Google Stitch’i sıradan olmayan ekranlara yönlendiren bir DESIGN.md yazar. 
Frontend & Arayüz Ne yapar image-to-code Önce tasarım görselleri üretir, onları analiz eder, sonra eşleşen frontend kodunu kurar. 
Frontend & Arayüz Ne yapar imagegen-frontend-mobile Premium mobil uygulama ekran akışlarını kod değil, görsel olarak üretir. Sonraki adım
Kurulum derdi olmadan Open Design ile tasarlayın
Bu eklentiyi kendiniz kurun ya da Open Design ile Codex’in etrafına baştan sona küratörlü bir tasarım katmanı geçirin. Kendi anahtarınızı getirin, çıktınızın sahibi olun.