Material Design Renk Paleti Oluşturucu
Google'ın Material Design kurallarına dayalı güzel renk paletleri oluşturun. Eksiksiz bir tema oluşturmak için ana ve vurgu renklerinizi seçin.
Palet Oluşturucu
Oluşturulan Palet
Eksiksiz Material Design Renk Paleti
Material Design renklerinin tam setine göz atın. Hex kodunu kopyalamak için herhangi bir renge tıklayın.
Kırmızı
Pembe
Mor
Mavi
Yeşil
Turuncu
Turkuaz
Kehribar
Kullanım İpuçları
- Ana renginiz olarak 500 tonunu kullanın
- Daha koyu varyantlar için (uygulama çubukları gibi) 700 tonunu kullanın
- Kayan işlem düğmeleri ve vurgular için vurgu renklerini (A200, A400) kullanın
- Erişilebilirlik için uygun kontrast oranlarını sağlayın
Profesyonel Material Design Renk Oluşturucu
Modern kullanıcı arayüzü geliştirme ve Android uygulama tasarımı için Material You paletleri, resmi renk belirteçleri ve profesyonel dışa aktarma seçenekleriyle eksiksiz Google Material Design 3 renk sistemine erişin.
Neden Material Design Oluşturucumuzu Seçmelisiniz?
Kapsamlı aracımız, Material You dinamik temalandırma, resmi Google renk belirteçleri ve profesyonel dışa aktarma formatlarıyla eksiksiz Material Design 3 renk sistemine erişim sağlar.
- Material Design 3 system
- Material You palettes
- Official color tokens
- Dynamic theming
- Multiple export formats
- Developer-ready code
Eksiksiz Material Design 3 Sistemi
Ana, ikincil, üçüncül renkler, yüzey varyantları ve anlamsal renk rolleriyle eksiksiz tonal paletler dahil olmak üzere tam Material Design 3 renk sistemine erişin.
Material You Dinamik Temalandırma
Modern Android uygulamaları için otomatik açık/koyu tema varyantları ve kişiselleştirilmiş renk çıkarımıyla tohum renklerden Material You renk şemaları oluşturun.
Geliştiriciye Hazır Dışa Aktarma Seçenekleri
Uygun adlandırma kurallarıyla CSS özel özellikleri, SCSS değişkenleri, JSON belirteçleri, Android için XML kaynakları, Figma belirteçleri ve Flutter tema verileri olarak dışa aktarın.
Şunlar için ideal:
- Android app development
- Web applications
- Flutter projects
- Design systems
- UI component libraries
- Material UI theming
Nasıl Çalışır:
Renk Sistemi Seçin
Material Design 3 klasik renklerinden seçim yapın veya tohum renginizden Material You paletleri oluşturun.
Özelleştirin ve Önizleyin
Tonal değerleri ayarlayın, açık/koyu temaları önizleyin ve renklerin Material Design bileşenlerinde nasıl çalıştığını görün.
Dışa Aktarın ve Uygulayın
Renk belirteçlerini tercih ettiğiniz formatta indirin ve doğrudan geliştirme iş akışınıza entegre edin.
Sık Sorulan Sorular
Material Design 3, Google'ın gelişmiş renk rolleri ve anlamsal belirteçlere sahip en yeni tasarım sistemidir. Material You ise kullanıcı duvar kağıtlarından veya tohum renklerden özel renk şemaları oluşturan, MD3 ilkelerini korurken kişisel tercihlere uyum sağlayan dinamik temalar yaratan kişiselleştirme katmanıdır.
Marka renginizi veya tercih ettiğiniz tonu tohum renk olarak girin. Algoritmamız, Google'ın Material You özelliklerine uygun olarak her biri 0'dan (siyah) 100'e (beyaz) kadar 13 tonal varyasyona sahip ana, ikincil, üçüncül, nötr ve nötr varyant renk aileleriyle eksiksiz bir tonal palet oluşturur.
CSS özel özellikleri, SCSS/Sass değişkenleri, JSON tasarım belirteçleri, Android için XML kaynakları, JavaScript/TypeScript nesneleri, Figma tasarım belirteçleri, Flutter ColorScheme temaları ve Swift iOS renk varlıkları olarak dışa aktarın. Tüm dışa aktarımlar uygun anlamsal adlandırma kuralları içerir.
Evet! Material Design 3 renk sistemi erişilebilirlik göz önünde bulundurularak oluşturulmuştur. Tonal palet sistemi, yüzey renkleri ile yüzey üzeri metin renkleri arasında uygun kontrast oranları sağlar. Aracımız WCAG uyumluluk düzeylerini gösterir ve otomatik olarak erişilebilir renk eşleştirmeleri sunar.
Kesinlikle! Material Design renkleri açık kaynaklıdır ve herhangi bir projede kullanılabilir. Sistem Google ürünleri için tasarlanmış olsa da, renk bilimi ve erişilebilirlik ilkeleri onu web, mobil veya masaüstü uygulamaları fark etmeksizin her modern kullanıcı arayüzü için mükemmel kılar.
Material Design 3, açık ve koyu temalar için uygun tonal değerlere otomatik olarak eşlenen anlamsal renk rolleri kullanır. Örneğin, 'ana' rengi açık temada 40 tonunu, koyu temada ise 80 tonunu kullanır. Oluşturucumuz, uygun kontrast ve erişilebilirliği koruyarak her iki tema varyantını da sunar.