کیا آپ کو موک اپ، چارٹ، یا خالی کینوس کے لیے رنگ چاہیے، لیکن ہمیشہ ایک ہی انتخاب کرنے سے تھک گئے ہیں؟ یہ مفت بے ترتیب رنگ جنریٹر 24-bit کی مکمل رینج سے رنگ لیتا ہے جو اسکرین دکھا سکتا ہے، اور ہر رنگ کو اس کے کوڈ کے ساتھ ایک رنگ کے نمونے پر ظاہر کرتا ہے۔ “انتخاب کی تعداد” کے خانے میں 1 سے 50 تک کتنے رنگ چاہیں وہ منتخب کریں، مطلوبہ فارمیٹ چیک کریں، اور “بنائیں” دبائیں۔ صفحہ HEX میں ایک رنگ کے ساتھ کھلتا ہے، اس لیے پہلے نتیجے کے لیے صرف ایک کلک درکار ہے۔ “HEX کوڈ” کا چیک باکس شروع سے منتخب ہوتا ہے، اور اس کے ساتھ “RGB کوڈ” اور “HSL کوڈ” ہوتے ہیں، تینوں میں سے کوئی بھی مجموعہ بیک وقت آن کیا جا سکتا ہے۔ “بنائیں” کے ساتھ گیئر بٹن “اعلی درجے کے اختیارات” پینل کھولتا ہے، جہاں آپ رنگوں کو کسی مخصوص قسم یا رینج تک محدود کر سکتے ہیں، تکرار سے بچ سکتے ہیں، اور HEX کے لکھنے کا طریقہ بدل سکتے ہیں۔
ہر رنگ آپ کے براؤزر میں Web Crypto API (crypto.getRandomValues) کے ذریعے بنایا جاتا ہے، جو Math.random() جیسے سیوڈو رینڈم فنکشن کے بجائے آپ کے سسٹم کے اپنے ماخذ سے کرپٹوگرافک طور پر مضبوط بے ترتیب بائٹس فراہم کرتا ہے۔ اسکرین پر ایک رنگ کے تین چینل ہوتے ہیں — سرخ، سبز، اور نیلا — ہر ایک 0 سے 255 تک عدد صحیح، اور ایک بے ترتیب بائٹ بالکل 256 ممکنہ قدروں میں سے ایک لیتا ہے۔ اس لیے ہر چینل صرف ایک بائٹ ہے، کوئی تقسیم اور کوئی باقی نہیں، اور کوئی رنگ کسی تبدیلی کے مرحلے سے فائدہ نہیں اٹھاتا۔ اس سے صفحے کے بنا سکنے والے تمام 16,777,216 رنگوں کو “بنائیں” کے ہر دباؤ میں برابر موقع ملتا ہے۔ “اعلی درجے کے اختیارات” میں تنگ رینج اس اصول کو رینج کے اندر قائم رکھتی ہے: رنگ اب بھی پوری جگہ سے لیے جاتے ہیں، باہر والے ہٹا دیے جاتے ہیں، اس لیے رینج کے اندر ہر رنگ کو ایک جیسا موقع ملتا ہے۔ سرور کو کچھ نہیں بھیجا جاتا، کچھ لاگ نہیں ہوتا، اور صفحہ لوڈ ہونے کے بعد انٹرنیٹ کنیکشن بند کرنے پر بھی کام کرتا رہتا ہے۔
یہ تینوں فارمیٹ ایک ہی رنگ کو تین طریقوں سے بیان کرتے ہیں۔ “HEX کوڈ” فارمیٹ CSS اور زیادہ تر ڈیزائن ٹولز میں استعمال ہونے والی چھ ہندسوں کی شکل ہے جیسے #0778ff؛ یہ آگے # کے ساتھ چھوٹے حروف میں لکھی جاتی ہے، اور “اعلی درجے کے اختیارات” میں “بڑے حروف” اور “# لگائے بغیر” آپشن اسے ان ٹولز کے لیے بدلتے ہیں جن میں کوئی اور فارمیٹ درکار ہو۔ “RGB کوڈ” فارمیٹ تین چینل الگ الگ rgb(7, 120, 255) کے طور پر دکھاتا ہے، جو اس کوڈ کے لیے موزوں ہے جو ہر چینل پر الگ کام کرتا ہے۔ “HSL کوڈ” فارمیٹ رنگ کو ہیو، سیچوریشن، اور لائٹنیس کے ذریعے hsl(213, 100%, 51%) کے طور پر بیان کرتا ہے، بعد میں دستی ایڈجسٹمنٹ کے لیے سب سے آسان شکل۔ تینوں کو براہ راست سٹائل شیٹ میں پیسٹ کیا جا سکتا ہے۔ لیکن یہ یکساں طور پر درست نہیں ہیں۔ “HEX کوڈ” اور “RGB کوڈ” بالکل درست ہیں؛ “HSL کوڈ” تخمینہ ہے۔ صفحہ ہیو، سیچوریشن، اور لائٹنیس کو عدد صحیح کے طور پر لکھتا ہے، اور تقریباً 89% رنگوں کے لیے وہ تخمینی قدر واپس اصل رنگ نہیں دیتی: #646503 کو hsl(61, 94%, 20%) کے طور پر دکھایا جاتا ہے، جو واپس بدلنے پر #616303 بنتا ہے۔ فرق کسی بھی چینل میں 5 قدم سے زیادہ نہیں، عام طور پر 1 یا 2 — اسکرین پر آنکھ کو نظر نہیں آتا، لیکن اصلی جب HSL قدر محفوظ کی جائے اور اصل HEX واپس کی توقع ہو۔ اس لیے HEX یا RGB کو اپنی محفوظ کردہ قدر کے طور پر رکھیں۔
ایک رنگ کا نتیجہ درمیان میں ایک چپ کے طور پر ظاہر ہوتا ہے؛ کئی رنگ نمبر والی فہرست کے طور پر ظاہر ہوتے ہیں، ہر قطار میں ایک رنگ، منتخب فارمیٹ ساتھ ساتھ اور آخر میں ایک چھوٹا کنٹراسٹ بیج۔ تین سے زیادہ رنگوں کی فہرست باکس کے اندر سکرول ہوتی ہے، کونے میں تیر اسے پوری اونچائی تک کھولتا ہے؛ صفحہ یاد رکھتا ہے کہ آپ نے اسے کیسے چھوڑا۔ صرف وہ کوڈ کاپی کرنے کے لیے کسی بھی کوڈ پر کلک کریں۔ قطار کے آخر میں “کاپی” بٹن اس رنگ کے تمام کوڈ ایک لائن میں، خالی جگہوں سے الگ، کاپی کرتا ہے۔ رنگ کے نمونے پر کلک کرنے سے آپ کے براؤزر کا اپنا رنگ چننے والا کھلتا ہے: وہاں کوئی اور رنگ منتخب کرنے سے اس قطار کا ہر کوڈ آپ کے آن کردہ ہر فارمیٹ میں اس کے بیج کے ساتھ دوبارہ لکھا جاتا ہے۔ “سب کاپی کریں” پورے بیچ کو، ہر قطار میں ایک رنگ، کاپی کرتا ہے؛ “فائل میں محفوظ کریں” وہی متن .txt فائل کے طور پر محفوظ کرتا ہے؛ دونوں آپ کے رنگ چننے والے میں تبدیل کردہ رنگوں کی پیروی کرتے ہیں۔ “تاریخچہ” اس براؤزر میں آپ کے آخری 10 بیچ محفوظ رکھتا ہے جیسے انہیں بنایا گیا تھا، “صاف کریں” نتیجہ ہٹاتا ہے۔ آپ کی سیٹنگز، “اعلی درجے کے اختیارات” کی بھی، اگلی وزٹ کے لیے یاد رکھی جاتی ہیں۔
برابر موقع والے رنگ یکساں طور پر پھیلے نظر نہیں آتے، اور یہ جاننا کہ کیا توقع رکھنی ہے غلط وجہ سے “بنائیں” دبانے سے بچاتا ہے۔ پوری رینج میں پیمائش کریں تو تقریباً 35% رنگ روشن اور سیر شدہ ہیں، جن میں کم از کم 70% HSL سیچوریشن اور 35%–65% کے درمیان لائٹنیس ہے۔ 20% سے کم سیچوریشن والے سرمئی رنگ صرف تقریباً 4% ہیں، بہت گہرے رنگ (20% سے کم لائٹنیس) اور بہت ہلکے (80% سے زیادہ) ہر ایک تقریباً 3%۔ اس لیے “تمام رنگ” سے دس رنگوں کا بیچ عام طور پر کئی بولڈ رنگ رکھتا ہے، اور پیسٹل یا سرمئی کے قریب رنگ شاذ ہی آتے ہیں۔ اگر آپ کو کوئی خاص قسم چاہیے تو “رنگ کی قسم” میں منتخب کریں: “چمکدار” صرف اسی سیر شدہ گروپ کو رکھتا ہے، “پیسٹل”، “گہرا”، “دھیما”، اور “سرمئی” اپنے اپنے زمروں کے لیے ایسا کرتے ہیں۔ “کسٹم” آپ کو اپنی “ہیو”، “سیچوریشن”، اور “لائٹنیس” کی رینج مقرر کرنے دیتا ہے، اور ہیو رینج 0 سے آگے چل سکتی ہے، اس لیے 330 سے 30 سرخ رنگ دیتا ہے۔ رینج کو صفحے کے دکھائے “HSL کوڈ” کے خلاف جانچا جاتا ہے، کوئی کوڈ رینج سے باہر نہیں جاتا، اور اگر آپ کی “انتخاب کی تعداد” کے لیے بہت کم رنگ ہیں تو صفحہ رنگ دہرانے کی بجائے رینج بڑھانے کو کہتا ہے۔ ورنہ تکرار ممکن لیکن نادر ہیں: انہیں مکمل طور پر روکنے کے لیے “تکرار سے بچیں” چیک کریں؛ اس کے بغیر پوری رینج سے 50 رنگوں میں دو یکساں آنے کا امکان تقریباً 13,700 میں 1 ہے۔
بے ترتیب رنگ اکثر پس منظر کے طور پر چاہیے ہوتا ہے، جو ایک ایسا سوال اٹھاتا ہے جس کا جواب رنگ کا نمونہ نظروں سے نہیں دے سکتا: کیا اس پر متن پڑھا جا سکتا ہے؟ ویب رسائی کی ہدایت WCAG باقاعدہ متن کے لیے کم از کم 4.5:1 کنٹراسٹ تناسب کا تقاضا کرتی ہے۔ صفحے کے بنانے کے قابل ہر رنگ میں پیمائش کریں تو کالا متن تقریباً 65% رنگوں پر وہ پیمانہ پورا کرتا ہے اور سفید متن تقریباً 36% پر، اور کوئی رنگ ایسا نہیں کہ دونوں ناکام ہوں: بہتر آپشن ہمیشہ کم از کم 4.58:1 تک پہنچتا ہے۔ اس لیے کسی بھی بے ترتیب پس منظر کے لیے کالا یا سفید متن معیار پورا کرے گا، اور صفحہ دکھاتا ہے کہ کون سا۔ ہر رنگ کے ساتھ ایک چھوٹا بیج ہے جس میں دونوں میں سے بہتر رنگ میں Aa لکھا ہے، اس کے کنٹراسٹ تناسب کے ساتھ۔ تناسب نیچے گول کیا جاتا ہے تاکہ یہ کبھی رنگ کو بڑھا چڑھا کر نہ دکھائے، اور رنگ چننے والے میں رنگ بدلنے پر اپ ڈیٹ ہوتا ہے۔ بیج صرف کالے اور سفید متن کا موازنہ کرتا ہے؛ برانڈ رنگ یا کسی اور متن کے رنگ کے لیے، اس جوڑے کو کنٹراسٹ چیکر سے جانچیں۔
بے ترتیب ہم آہنگ کے برابر نہیں ہے۔ بیچ کا ہر رنگ آزادانہ لیا جاتا ہے، دوسروں سے بے خبر، اس لیے یہ جنریٹر کبھی ڈیزائنر کے معنوں میں پیلیٹ نہیں بناتا — کوئی تکمیلی جوڑے نہیں، کوئی مماثل سیریز نہیں، کوئی مشترکہ لائٹنیس نہیں۔ تنگ رینج بیچ کی خصلت بدلتی ہے، وہ اصول نہیں: پیسٹل یا نیلے رنگوں کی سیریز پھر بھی ایک ایک کر آئے گی، بیچ میں کوئی ربط نہیں۔ یہی اس ٹول کا مقصد ہے: یہ آپ کو وہ رنگ دیتا ہے جو آپ خود نہ چنتے، جو عادت یا تخلیقی رکاوٹ کو توڑتا ہے۔ ملنے والی بے ترتیب چیز کو مفید بنانے کے لیے، پسند کا رنگ رکھیں اور باقی رنگ اسی سے اخذ کریں، بجائے اس کے کہ “بنائیں” تب تک دبائیں جب تک پورا سیٹ اتفاقی طور پر ایک نہ ہو جائے۔ ہیو کو قائم رکھیں اور ہلکے اور گہرے متغیرات کے لیے لائٹنیس بدلیں، یا مخالف رنگ کے لیے ہیو کو 180 ڈگری گھمائیں۔ “HSL کوڈ” فارمیٹ ان حرکات کو اندازے کے بجائے ریاضی بناتا ہے۔
اس بے ترتیب رنگ جنریٹر کو کیوں چنیں؟
- ہر رنگ Web Crypto API کے ساتھ آپ کے براؤزر میں بنتا ہے، کچھ اپ لوڈ نہیں
- تمام 16,777,216 رنگوں کو بالکل برابر موقع، ہر چینل کے لیے ایک بے ترتیب بائٹ
- ایک ہی رنگ کے لیے HEX، RGB، اور HSL کوڈ، کسی بھی مجموعے میں
- بیک وقت 50 تک رنگ، ہر ایک رنگ کے نمونے پر کنٹراسٹ بیج کے ساتھ
- چمکدار، پیسٹل، گہرا، دھیما، اور سرمئی، یا اپنی ہیو، سیچوریشن، اور لائٹنیس کی رینج مقرر کریں
- ضرورت پڑنے پر تکرار سے بچیں، اور HEX بڑے حروف میں یا # کے بغیر
- کاپی کرنے کے لیے کوڈ پر کلک کریں، یا اپنے براؤزر کے رنگ چننے والے میں کوئی بھی رنگ بدلیں
- سب کاپی کریں، فائل میں محفوظ کریں، اور براؤزر میں آخری 10 بیچ کی تاریخچہ
- مفت اور لامحدود: سائن اپ کی ضرورت نہیں، کوئی کوٹہ نہیں، ہمارے سرورز پر کچھ محفوظ نہیں
بے ترتیب رنگ وہاں کام کرتے ہیں جہاں کسی کے فیصلہ کرنے سے پہلے رنگ کی ضرورت ہو۔ ڈیزائنر تخلیقی رکاوٹ توڑنے اور وہ شروعاتی نقطہ تلاش کرنے کے لیے انہیں استعمال کرتے ہیں جو ان کا معمول کا پیلیٹ کبھی نہیں دیتا۔ ڈویلپرز موک اپ، پلیس ہولڈرز، اور اوتار بھرتے ہیں، اصل تھیم طے ہونے سے پہلے چارٹ کی ہر سیریز کو اپنا رنگ دیتے ہیں، اور جانچتے ہیں کہ انٹرفیس ان پس منظروں کے ساتھ کیسا برتاؤ کرتا ہے جن کے لیے اسے ڈیزائن نہیں کیا گیا — “تمام رنگ” سے 50 رنگوں کے بیچ میں تقریباً ہمیشہ کم از کم ایک بہت گہرا یا بہت ہلکا رنگ ہوتا ہے، “گہرا” یا “پیسٹل” جانچ کو کسی مخصوص انتہا کی طرف ہدایت دیتے ہیں۔ جنریٹیو آرٹسٹ اور گیم پروٹوٹائپر قدروں کو براہ راست کوڈ میں فیڈ کرتے ہیں، جہاں RGB فارمیٹ زیادہ تر گرافکس لائبریریوں میں سیدھا فٹ ہوتا ہے۔ استاد تینوں فارمیٹ ساتھ رکھتے ہیں یہ دکھانے کے لیے کہ ایک رنگ کوڈ کے طور پر، تین چینلوں کے طور پر، یا رنگ کے پہیے پر پوزیشن کے طور پر کیسے لکھا جا سکتا ہے، اور HSL ورژن کیوں گول کیا جاتا ہے۔ لیبل لگانے، ٹیگ کرنے، یا فہرست کو رنگ کوڈ کرنے والا کوئی بھی بغیر فکر کے مختلف رنگ حاصل کرتا ہے۔
کچھ ایمانداری سے محدودیتیں ہیں جو جاننی چاہئیں۔ یہ ایک جنریٹر ہے، پیلیٹ ٹول نہیں: یہ رنگ ہم آہنگیاں نہیں بناتا اور دوسرے رنگ بدلتے وقت ایک رنگ لاک نہیں کرتا، اور تنگ رینج ایک قسم کے رنگ دیتی ہے، ایک دوسرے سے میل کھانے والے رنگ نہیں۔ کنٹراسٹ بیج صرف کالے اور سفید متن کا موازنہ کرتا ہے۔ صفحہ اسکرین sRGB رنگوں میں — HEX، RGB، اور HSL — شفافیت کے بغیر کام کرتا ہے، اور کوئی CMYK، Pantone، OKLCH، یا نام والے CSS رنگ نہیں؛ پرنٹ کے لیے اسکرین کوڈ پر بھروسے کے بجائے اپنے پرنٹ کے عمل میں رنگ ملائیں۔ ایک ہی کوڈ مختلف اسکرینوں پر قدرے مختلف نظر آ سکتا ہے کیونکہ اسکرینیں یکساں کیلیبریٹ نہیں ہوتیں۔ HSL قدریں اوپر بیان کردہ طریقے سے گول کی جاتی ہیں، اور اگر “تکرار سے بچیں” چیک نہ ہو تو بیچ کو تکرار کے لیے جانچا نہیں جاتا۔ صفحے کی ضمانت تنگ اور درست ہے: اس کے 16,777,216 رنگوں میں سے ہر ایک، یا آپ کی مقرر کردہ رینج کے اندر ہر رنگ، ہر دباؤ پر برابر موقع رکھتا ہے، آپ کے براؤزر کے کرپٹوگرافک ماخذ سے لیا جاتا ہے اور کہیں نہیں بھیجا جاتا۔