CSS Gradient Generatörü

Lineer, radyal ve konik CSS gradientleri tarayıcınızda oluşturun.

Renk durdu

Durumları düzenlemek için durak kolları veya klavye çubukları kullanın. her durak açık bir renk, opacity ve yüzde içerir.

Hazır

Yerel İşleme Browsers Native

Bu tarayıcıda kalır. hiçbir renk veya oluşturulan CSS'ler dönüştürücüye gönderilmez.

Sınırlı ithalat gramer

İthalat, lineer gradient(), radial gradiant(), veya hex renkleri ve oranları ile konik gradien() kabul eder. ifadeler, URL'ler, değişkenler ve bilinmeyen fonksiyonlar yerel olarak reddedilir.

Düşük düşüş

Üretilen CSS, desteklenmemiş renderler ve erişilebilir kontrol krom için gradient yanı sıra sağlam bir arka plan renkli düşüş içerir.

Sıkça sorulan sorular

Gradient yüklendi mi?

Gradient durumu, renkler, ithal CSS ve oluşturulan CSS tarayıcınızda kalır.

Hangi CSS gradient türleri desteklenir?

Generatör, lineer-gradant(), radial-gradent(), ve konik-gradantin() çıkışını birden fazla hex renk durakları ile oluşturur.

Neyi ithal edebilirim?

İthalat, bir gradient fonksiyonu, hex renkleri, seçmeli yüzdeleri ve sınırlı açı veya pozisyon değerlerini kullanarak kasıtlı olarak sınırlı bir grammar kabul eder.

CSS Gradient Generatörü

Lineer veya radyal CSS gradientleri oluşturun ve renk durakları, açı, pozisyon ve tekrarlama önizlemesi yapın.

Giriş
Gradient tipi, renk durakları, pozisyonlar, açı ve tekrar ayarları.
Çıktı
Canlı bir önizleme ve kopyalanabilir CSS arka plan beyanı.
Gerçek Sınırlamalar
Tarayıcı renderasyonu motorda biraz farklı olabilir ve araç, miras tarayıcılarda kontrast veya destek garantisi değerlendirmez.
Gizlilik ve veri işleme
gradient tipi, renk durakları, pozisyonlar, açı ve tekrar ayarları bu tarayıcı sekmesinde işlenir. dönüştürücü almaz veya depolamaz; sayfanın kapatılması veya yeniden yüklemesi, aracın açıkça yerel bir indirme sunmadığı sürece çalışma durumunu temizler.

Bu aracı nasıl kullanırız

  1. Gradient tipi, renk durakları, pozisyonlar, açılar ve tekrarlama ayarları aracın kontrollerinde sağlar.
  2. Canlı bir önizleme ve kopyalanabilir CSS arka plan beyanını etkileyen ayarları seçin, sonra aracı çalıştırın.
  3. Kopyalamadan veya indirmeden önce canlı bir önizleme ve kopyalanabilir CSS arka plan beyanını inceleyin.

• Ortak başarısızlık modları

Eksik renk durakları, bozuk renkler veya uyumsuz pozisyonlar, geçerli bir CSS beyanının oluşturulmasını engeller.

Faydalı örnek

90 derece lineer gradient oluşturun #111827'den% 0'a kadar #f59e0b'ye kadar% 100'e kadar ve beyanı kopyalayın.