CSS Gradient Generator
Rang va burchagini tanlang va CSS gradient kodini real-time preview bilan yarating
Xususiyatlar
Preview va kod bir vaqtda yangilanadi
Rang yoki burchagini o'zgartirganda ko'rinish va CSS bir vaqtda o'zgaradi
Chiziqli, doiraviy va konus shaklga mos
Burchak, shakl, markaz joylashuvini turga ko'ra batafsil belgilang
10 gacha rang drag bilan sozlang
Rang joylashuvini paneldagi drag bilan, shaffoflikni slider bilan sozlang
8 namuna va tasodifiy yaratish
Standart ranglardan yoki tasodifiy ranglardan boshlab kichik sozlamalar qiling
Foydalanish
Turini tanlang
Chiziqli, doiraviy yoki konus shakldan gradient turini tanlang
Rangni belgilang
Rang kodidan yoki namunadan rang tanlang, "Rang qo'shish" bilan ranglarni ko'paytiring va joylashuvni shaffoflik bilan sozlang
Yo'nalishni sozlang
Chiziqli uchun burchak yoki yo'nalish tugmalarini, doiraviy va konus uchun markaz joylashuvini belgilang
Kodini nusxalang
"Nusxalash" tugmasi bilan bir qatorli CSS kodini o'zingizning stilga qo'ying
Foydalanish holatlari
Hero suratining fon yaratish
Saytning yuqori yoki tugma fonini kod yozmasdan belgilang
Blog sarlavhasi rangini tanlash
Namunadan yaqin rangni tanlang va maqola sarlavha fonini sozlang
Suratga chekiliish overlay
Shaffoflikni kamaytirgan rang bilan surat ustiga yarim shaffof qatlamni yarating
Ko'p rangning gradient sozlash
3 va undan ortiq rangning chegarasini drag bilan birma-bir sozlang
Asosiy bilimlar
linear, radial va conic o'rtasidagi farq
CSS gradientida rangning o'zgarish usuli bilan farq qiluvchi 3 ta funksiya mavjud va barchasi background propertyga yoziladi.
- linear-gradient：linear-gradient belgilangan burchakdagi to'g'ri chiziq bo'ylab rang o'zgaradigan chiziqli gradientdir.
- radial-gradient：radial-gradient markaz joylashuvdan tashqariga qarab doira yoki ellips shakliga rang kengaygan doiraviy gradientdir.
- conic-gradient：conic-gradient markaz atrofida soat bo'ylab bir aylanib rang o'zgaradigan konus shaklidagi gradientdir.
Burchak va yo'nalish kalit so'zlari muvofiqati
linear-gradient burchagi 0deg pastdan yuqoriga yo'nalish va raqam ortgani sari soat bo'ylab buriladi. Burchak "to right" kabi yo'nalish kalit so'zlari bilan ham yoziladi, 90deg "to right" bilan, 180deg "to bottom" bilan bir xil yo'nalishdir.
Rang to'xtash nuqtasi va shaffoflik yozishi
Rang to'xtash nuqtasi (color stop) gradientda o'sha rang bo'ladigan joylashuvdir, 0% boshlang'ich nuqta, 100% yakuniy nuqtani anglatadi. Masalan "#3B82F6 0%, #8B5CF6 100%" boshlang'ichdagi ko'kdan yakuniy ko'smarga o'zgaradigan belgilashdir.
- #RRGGBB shakli：#RRGGBB shakli qizil, yashil, ko'k kuchini 2 ta raqamdagi 16lik sonda ifodalaydigan rang yozish usulidir, #FF0000 shaffof qizilni anglatadi.
- rgba shakli：rgba shakli qizil, yashil, ko'k qiymatiga (0–255) shaffoflikni (0–1) qo'shgan rang yozish usulidir, 0.5 shaffoflik yarim shaffof rangni anglatadi.
Xavfsizlik va Maxfiylik
Faqat brauzerda
Kiritilgan ma'lumotlar faqat brauzeringizda qayta ishlanadi va tashqariga yuborilmaydi.
Faqat brauzer ichida qayta ishlash
Gradient kodini yaratish sizning brauzeringiz ichida bajariladi va kirish ma'lumotlari serverga yuborilmaydi.
Aloqa HTTPS orqali shifrlangan
Sahifani yuklash ham TLS orqali shifrlangan bo'lib, uchinchi tomonlar tomonidan tarkibi o'qilmaydi.
Uchinchi tomonlarga yuborish yo'q
Kirish tarkibi reklama tarmog'i yoki kuzatuvchi kabi tashqi xizmatlariga yuborilmaydi.
Natijalani avtomatik saqlash yo'q
Tanlagan rang va sozlamalar yoki kirish variantlari serverda saqlanmaydi.
Google qidiruvda RAKKOTOOLS ni kuzatib turing
184 ta qulay vosita Google qidiruv va AI qidiruvdan osonroq topiladi!
- qidiruvda topiladi
- AI qidiruvda ham ko'rsatiladi
- yangi vositalarni ham kashf eting
Yangilanishlar
- update #312
CSS gradiyent generatori qo'shildi, rangni va burchakni tanlash orqali kod yaratiladi
Ajralib vositalar
184ta bepul veb-asbobdan hoziroq foydalanishingiz mumkin!