Tasarım Sistemleri
Mesh Gradient Dark Blue Clean
Hero kabuğu içinde bir mesh alanı olan neredeyse siyah lacivert sistem.
Nedir
CSS renk token’ları, border-gradient bir hero kabuğu, canvas mesh alanı, cam navigasyon hapı, yüzen düğümler, raylar ve eşli CTA’larla koyu mavi bir yön.
Create a futuristic, premium, clean dark-blue mesh-gradient design system across background rendering, hero shell, navigation, floating nodes, framed sections, CTAs, and motion. Use when the interface needs a near-black
Tasarım için neden önemli
- Mesh hero kabuğunun içinde durur; böylece kompozisyonu süslemek yerine yönetir.
- Adlandırılmış token’lar; arka plan, kabuk, çizgi, metin ve vurgu değerlerini sayfa boyunca sabitler.
- Raylar, köşe kareleri ve düğüm hapları, minimal kabuğa teknik bir yapı kazandırır.
Neleri kapsıyor
- System recipe
- Color tokens
- Hero shell
- Canvas mesh field
- Nodes and rails
- Motion defaults
Nasıl kurulur
Mesh Gradient Dark Blue Clean
-
Depoyu klonlayın.
git clone https://github.com/MengTo/Skills -
Codex’i skill dosyasına yönlendirin.
agent-skills/web-design/mesh-gradient-dark-blue-clean/SKILL.md -
Sonra istediğiniz arayüzü anlatın. Codex skill’e uyar.
Codex ile nasıl çalıştırılır
-
Token bloğunu yapıştırın, sonra sayfa temelini ve hero kabuğunu kurun.
-
Mesh canvas’ı kabuğun içine, kabuk içeriğinin arkasına ekleyin.
-
Birkaç düğüm, ray ve işaretçi yerleştirin, sonra sürüklenme döngülerini yavaş tutun.
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.