رنگوں کے ٹولز

CSS گریڈینٹ جنریٹر: لینیئر، ریڈیل اور کونک – مفت

مفت، سائن اپ کی ضرورت نہیں، آپ کے براؤزر میں چلتا ہے۔ 2 سے 8 رنگوں کے ساتھ لینیئر، ریڈیل یا کونک گریڈینٹ بنائیں، لائیو دیکھیں اور CSS کوڈ کاپی کریں۔ PNG کے طور پر HD، 4K یا بینر سائز میں ڈاؤن لوڈ بھی کریں۔

رنگوں کے نقطے

  • 0%
  • 100%

CSS

background: #ff7ac6;
background: linear-gradient(135deg, #ff7ac6 0%, #ffe14d 100%);

پہلی لائن ایک ٹھوس رنگ ہے، پرانے آلات کے لیے جو گریڈینٹ نہیں دکھا سکتے۔

پری سیٹ سے شروع کریں

آپ کے آلے پر بنایا گیا۔

CSS گریڈینٹ جنریٹر کیوں استعمال کریں

100% مفت
جتنی بار چاہیں استعمال کریں۔ سائن اپ نہیں، واٹر مارک نہیں، کچھ انسٹال نہیں کرنا۔
ڈیزائن سے نجی
جو آپ لکھتے ہیں وہ آپ کے براؤزر میں رہتا ہے اور کبھی ہمیں نہیں بھیجا جاتا۔
ہر آلے پر کام کرتا ہے
Windows، Mac، Linux، Android اور iPhone پر آپ کے براؤزر میں چلتا ہے۔ کسی ایپ کی ضرورت نہیں۔

CSS گریڈینٹ جنریٹر کیسے استعمال کریں

  1. قسم چنیں: لینیئر، ریڈیل یا کونک۔ سلائیڈر سے سمت طے کریں، یا ریڈیل گریڈینٹ کے لیے Circle یا Ellipse چنیں۔
  2. “رنگ اسٹاپس” کے تحت ہر رنگ چنیں یا کوڈ لکھیں، اور اس کا سلائیڈر گھسیٹ کر اس کی جگہ طے کریں۔ مزید رنگوں کے لیے “اسٹاپ شامل کریں” استعمال کریں (8 تک)، اور ترتیب الٹنے کے لیے “الٹ دیں”۔
  3. یا “پریسیٹ سے شروع کریں” کے تحت کوئی پریسیٹ کلک کریں اور اس سے آگے بدلیں۔
  4. “CSS کاپی کریں” پر کلک کر کے اسے اپنی اسٹائل شیٹ میں چپکائیں، یا “تصویر کا سائز” چن کر “PNG ڈاؤن لوڈ کریں” پر کلک کریں۔

اکثر پوچھے جانے والے سوالات

CSS کیسے استعمال کروں؟

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

لینیئر، ریڈیل اور کونک میں کیا فرق ہے؟

لینیئر ایک سیدھی لکیر کے ساتھ ملتا ہے، ریڈیل مرکز سے دائرے یا بیضوی شکل میں پھیلتا ہے، اور کونک مرکز کے گرد رنگ کے پہیے یا پائی چارٹ کی طرح گھومتا ہے۔

لینیئر گریڈینٹ کی سمت کیسے بدلوں؟

سمت کا سلائیڈر 0° سے 360° تک گھسیٹیں۔ 0° نیچے سے اوپر، 90° بائیں سے دائیں، 180° اوپر سے نیچے، اور 135° نیچے دائیں کی طرف ترچھا چلتا ہے۔

ایک گریڈینٹ میں کتنے رنگ ہو سکتے ہیں؟

2 سے 8 رنگ اسٹاپس۔ ہر اسٹاپ کی جگہ 0% سے 100% تک ہوتی ہے؛ رنگوں کے درمیان ملاوٹ کے بجائے سخت لکیر چاہیں تو دو اسٹاپس ایک ہی جگہ پر رکھیں۔

کیا میں شفافیت استعمال کر سکتا ہوں؟

جی ہاں۔ کسی اسٹاپ میں rgba(47, 91, 255, 0.5) جیسا رنگ یا 8 ہندسوں کا HEX کوڈ لکھیں، اور گریڈینٹ وہاں شفاف ہو جاتا ہے۔

کیا میں گریڈینٹ کو تصویر کے طور پر ڈاؤن لوڈ کر سکتا ہوں؟

جی ہاں۔ 1920 × 1080، 3840 × 2160، 1080 × 1080، 1080 × 1920 یا 1500 × 500 چنیں اور “PNG ڈاؤن لوڈ کریں” پر کلک کریں، وال پیپر، سلائیڈ، سوشل پوسٹ یا ہیڈر کے لیے۔

کیا یہ CSS Tailwind، React یا WordPress کے ساتھ کام کرتا ہے؟

جی ہاں۔ کوڈ سادہ CSS ہے، اس لیے اسے اپنی اسٹائل شیٹ میں کسی کلاس میں ڈالیں (یا کسٹم CSS باکس میں) اور وہ کلاس عنصر کو دیں۔ یہ ہر جدید براؤزر میں کام کرتا ہے۔

کیا کچھ اپ لوڈ ہوتا ہے؟

نہیں۔ گریڈینٹ آپ کے آلے پر بنتے ہیں۔

کیا CSS گریڈینٹ جنریٹر مفت ہے؟

جی ہاں۔ یہ استعمال کے لیے مفت ہے، سائن اپ کی ضرورت نہیں اور کچھ انسٹال نہیں کرنا۔

مدد اور طریقہ کار کی گائیڈز (انگریزی میں)

متعلقہ ٹولز