Preview

سی ایس ایس تیار کیا۔

background: linear-gradient(135deg, #4F46E5, #8B5CF6);

گریڈینٹ کنٹرولز

135°
0%
100%

مقبول پیش سیٹ

تدریجی مثالیں۔

ان شاندار تدریجی مثالوں کو دریافت کریں اور اپنے اگلے پروجیکٹ کے لیے حوصلہ افزائی کریں۔ جنریٹر میں لوڈ کرنے کے لیے کسی بھی گریڈینٹ پر کلک کریں۔

سن سیٹ بلش

خوبصورت غروب آفتاب سے متاثر ایک گرم میلان۔

سمندری ہوا

ایک پرسکون میلان جو ساحلی پانیوں کے احساس کو جنم دیتا ہے۔

ٹکسال فیوژن

ٹکسال اور آسمانی نیلے رنگ کو ملانے والا ایک تازہ اور جدید میلان۔

سرسبز باغ

فطرت کی خوبصورتی کی نمائندگی کرنے والا ایک متحرک میلان۔

کائناتی خواب

رات کے آسمان سے متاثر ایک جادوئی میلان۔

گولڈن آور

گودھولی کے جوہر کو پکڑنے والا ایک گرم میلان۔

تدریجی دستاویزات

CSS Gradients کیا ہیں؟

CSS گریڈیئنٹس آپ کو دو یا زیادہ رنگوں کے درمیان ہموار ٹرانزیشن دکھانے کی اجازت دیتے ہیں۔ وہ عناصر کے پس منظر کے طور پر استعمال ہوسکتے ہیں اور تین مختلف اقسام میں آتے ہیں:

  • لکیری میلان:سیدھی لکیر کے ساتھ رنگوں کو منتقل کریں۔
  • ریڈیل گریڈینٹس:ایک مرکز سے باہر کی طرف منتقلی رنگ۔
  • مخروطی میلان:ایک دائرے میں کسی مرکز کے ارد گرد رنگوں کی منتقلی۔

گریڈیئنٹس کا استعمال کیسے کریں۔

ایک بار جب آپ ہمارے ٹول کا استعمال کرتے ہوئے گریڈینٹ تیار کر لیتے ہیں، تو آپ اپنے پروجیکٹس میں CSS کوڈ استعمال کر سکتے ہیں:

  1. جنریٹر سے سی ایس ایس کوڈ کاپی کریں۔
  2. اسے اپنی CSS فائل میں چسپاں کریں، یا اسے اپنے HTML عناصر میں ان لائن استعمال کریں۔
  3. کا استعمال کرتے ہوئے کسی بھی عنصر پر میلان کا اطلاق کریں۔background property.
.my-element {
background: linear-gradient(135deg, #4F46E5, #8B5CF6);
}

  • زیادہ پیچیدہ میلان اثر کے لیے دو سے زیادہ رنگ استعمال کریں۔
  • جہاں منتقلی ہوتی ہے اسے کنٹرول کرنے کے لیے رنگ کی پوزیشنوں کو ایڈجسٹ کریں۔
  • اس سے بھی زیادہ تخلیقی اثرات کے لیے متعدد گریڈینٹ کو یکجا کریں۔
  • مخروطی میلان کے لیے، مرکز کو تبدیل کرنے سے دلچسپ نمونے بنتے ہیں۔
  • بعد میں استعمال کے لیے اپنے پسندیدہ میلان کو محفوظ کریں۔

براؤزر سپورٹ

جدید براؤزرز میں CSS گریڈیئنٹس وسیع پیمانے پر تعاون یافتہ ہیں۔ تاہم، انٹرنیٹ ایکسپلورر جیسے پرانے براؤزر ان کو صحیح طریقے سے پیش نہیں کر سکتے ہیں۔ ہمیشہ فال بیک رنگ فراہم کریں:

.my-element {
background: #4F46E5; /* Fallback color */
background: linear-gradient(135deg, #4F46E5, #8B5CF6);
}

Chrome

26+

Firefox

16+

Safari

6.1+

Edge

12+

اس ٹول کے بارے میں

ہمارا CSS گریڈینٹ جنریٹر ڈیولپرز اور ڈیزائنرز کو آسانی سے خوبصورت گریڈینٹ بنانے میں مدد کرنے کے لیے ڈیزائن کیا گیا ہے۔ چاہے آپ کسی ویب سائٹ، ایپلیکیشن پر کام کر رہے ہوں، یا صرف رنگوں کے ساتھ تجربہ کرنا چاہتے ہوں، یہ ٹول آپ کے پروجیکٹ کے لیے بہترین میلان پیدا کرنا آسان بناتا ہے۔

Features

استعمال میں آسان

میلان بنانے کے لیے بدیہی انٹرفیس۔

قبول ڈیزائن

تمام سکرین کے سائز پر بالکل کام کرتا ہے۔

کاپی پیسٹ تیار ہے۔

صاف سی ایس ایس کوڈ فوری طور پر حاصل کریں۔

پیش سیٹیں دستیاب ہیں۔

خوبصورت پہلے سے طے شدہ میلان کے ساتھ شروع کریں۔

Related Tools