Summary
Bu yapay zeka WordPress tema oluşturucusu, adına rağmen kural tabanlıdır: tek bir marka renginden theme.json üretir. Paleti hesaplar, metin, bağlantı ve butonlar için WCAG kontrastını denetler ve modüler bir yazı ölçeği kurar. Kurallar sabit olduğu için çıktı öngörülebilir ve test edilebilirdir. Dosyayı bir blok temaya kopyalayın ve Site Editor'de ince ayar yapın.
Saniyeler içinde theme.json paleti ve yazı ölçeği üretin
Bu yapay zeka WordPress tema oluşturucusu, tüm siteyi vaat etmek yerine doğrulayabileceğiniz kısmı yapar: kontrast kontrollü bir palet, modüler bir yazı ölçeği ve blok temanız için hazır bir theme.json.
Araç gerçekte neyi hesaplar
Tek renkten bir palet
Marka renginiz Birincil olur. Araç bu rengin tonunu okur ve HSL içinde Taban, Yüzey ve Kontrast'ı oluşturur: açık zeminde yüzde 97, 93 ve 11 parlaklıkta, koyu zeminde ise 9, 14 ve 92 parlaklıkta. Vurgu, renk çemberinde 150 derece ötede yer alır.
Kontrastı kendiniz denetleyin
WCAG 2.x parlaklık formülüyle dört çift ölçülür: gövde metni, bağlantı, buton metni ve vurgu. Her biri bir oran ve bir not alır. Bağlantı AA'yı geçemezse parlaklığı, geçene kadar adım adım değişir.
Modüler bir yazı ölçeği
Orta boy 1rem'dir. Büyük, çok büyük ve devasa boyutlar oranınızla bir, iki ve üç kez çarpılır; küçük boyut ise orana bölünür. 1.2 oranıyla 0.833, 1, 1.2, 1.44 ve 1.728 rem elde edersiniz.
Tasarım belirteçleri neden desenlerden önce gelir
Hero deseni, kart ızgarası ve altbilgi aynı palet slug'larını okur. Bu slug'lar kontrastı geçemeyen değerler taşıyorsa her desen aynı hatayı devralır ve bunu müşterinizin telefonunda öğrenirsiniz. Önce belirteçleri düzeltmek, oluşturduğunuz ya da Pattern Forge ile ürettiğiniz desenlerin zaten geçen renklerle başlamasını sağlar. Sonucu bir test ortamında değil, gerçek bir müşteri sitesinde deneyin.
- Palet slug'ları her blok ve desen tarafından paylaşılır
- Yazı boyutu slug'ları şablonlar arasında başlıkları tutarlı tutar
- Tek bir theme.json düzenlemesi tüm siteyi günceller
Üretilen dosyadan canlı temaya
-
1
Girdileri seçin
Müşterinin logosundaki marka rengiyle başlayın. Marka doğası gereği koyu değilse açık bir taban seçin, ardından tona uyan yazı tipi eşleşmesini belirleyin.
-
2
Kontrast raporunu okuyun
Başarısız ya da Yalnızca büyük metin yazan satırlara bakın. Gövde metni, bağlantı ve buton metni AA'yı geçene kadar tabanı ya da nötr tonu değiştirin.
-
3
Dosyayı temanıza kopyalayın
theme.json dosyasını kopyalayın, blok temanızın kök dizinine yapıştırın, ardından Site Editor'ü açıp paletin renk seçicide göründüğünü doğrulayın.
-
4
Elle ince ayar yapın
Çıktı bir başlangıç noktasıdır. Slug'ları tasarım sisteminize göre yeniden adlandırın, boşluk ve düzen ayarları ekleyin, dosyayı temanın geri kalanıyla birlikte commit edin.
Bu aracın yapmadıkları
Sayfa düzeni yok
Araç belirteç üretir, şablon üretmez. Üst bilgi, altbilgi ve sayfa yapısı hâlâ blok temanızdan ya da Site Editor'de oluşturduğunuz desenlerden gelir.
Web fontu yok
İki eşleşme de font isteğinden kaçınmak için sistem yazı tipi yığınlarını kullanır. Marka yazı tipleri, kendi barındırdığınız değişken bir font ve sizin ekleyeceğiniz bir fontFace girdisi gerektirir.
Estetik garantisi yok
Bir palet her kontrast testini geçip yine de düz görünebilir. Sonucu güvenli bir başlangıç noktası sayın, ardından Vurgu ve nötr tonları gerçek bir sayfada gözle ayarlayın.
Üreticiyle ilgili sorular
Bu gerçekten bir yapay zeka tema oluşturucusu mu?
Ücretsiz mi, renklerimi saklıyor mu?
Kontrast oranı nereden geliyor?
Bağlantı rengi neden marka renginden farklı?
Çıktı hangi WordPress sürümünü hedefliyor?
Yazı yığınları web'den bir şey yükler mi?
Sağdan sola (RTL) siteler için çalışıyor mu?
Dosya temamda nereye gider?
Tokenları boş bir sayfa yerine bir desene aktarın
theme.json yerindeyken Pattern Forge, paletinizi ve yazı ölçeğinizi kullanan Gutenberg desenleri çizer. Monk ücretsiz; Scribe ayda $12.