رنگ کوڈ جنریٹر اور کلر پکر

رنگ کوڈز، مختلف حالتیں، ہم آہنگیاں پیدا کریں، اور تضاد کے تناسب کو چیک کریں۔

رنگ کی تبدیلی

HEX

#871550

Disco

HEX
#871550
HSL
329, 73, 31
RGB
135, 21, 80
XYZ
12, 6, 8
CMYK
0, 84, 41, 47
LUV
30,72,-12
LAB
30, 50, -5
HWB
329, 8, 47

تغیرات

اس سیکشن کا مقصد آپ کے منتخب کردہ رنگ کے خالص سفید (ٹِنٹس) اور خالص سیاہ (شیڈز) کے اضافے کے ساتھ 10% اضافے میں درست پیداوار کرنا ہے۔

پرو ٹپ: ہوور اسٹیٹس اور شیڈوز کے لیے شیڈز استعمال کریں، ہائی لائٹس اور بیک گراؤنڈز کے لیے ٹِنٹس۔

شیڈز

آپ کے بنیادی رنگ میں سیاہ شامل کر کے بنائی گئی گہری تغیرات۔

ٹِنٹس

آپ کے بنیادی رنگ میں سفید شامل کر کے بنائی گئی ہلکی تغیرات۔

عام استعمال کے کیسز

  • UI کمپوننٹ اسٹیٹس (ہوور، ایکٹیو، ڈس ایبلڈ)
  • شیڈوز اور ہائی لائٹس کے ساتھ گہرائی پیدا کرنا
  • مستقل رنگ کے نظام بنانا

ڈیزائن سسٹم ٹپ

یہ تغیرات ایک مربوط رنگ پیلیٹ کی بنیاد بناتے ہیں۔ انہیں برآمد کریں تاکہ آپ کے پورے پروجیکٹ میں مستقل مزاجی برقرار رہے۔

رنگ کے امتزاج

ہر ہم آہنگی کا اپنا موڈ ہوتا ہے۔ ہم آہنگیوں کا استعمال کریں تاکہ رنگ کے امتزاج کو سوچا جا سکے جو ایک ساتھ اچھے لگتے ہیں۔

استعمال کا طریقہ

کسی بھی رنگ پر کلک کریں تاکہ اس کا hex ویلیو کاپی ہو جائے۔ یہ امتزاج ریاضیاتی طور پر بصری ہم آہنگی پیدا کرنے کے لیے ثابت شدہ ہیں۔

یہ کیوں اہم ہے

رنگ کی ہم آہنگیاں توازن پیدا کرتی ہیں اور آپ کے ڈیزائنز میں مخصوص جذبات کو ابھارتی ہیں۔

مکمل

ایک رنگ اور اس کا مخالف رنگ پہیہ پر، +180 ڈگری کا رنگ۔ زیادہ تضاد۔

#871550
بہترین استعمال: زیادہ اثر والے ڈیزائن، CTAs، لوگوز

تقسیم-مکمل

ایک رنگ اور اس کے مکمل کے ساتھ ملحقہ دو، مرکزی رنگ کے مخالف قیمت سے +/-30 ڈگری کا رنگ۔ سیدھے مکمل کی طرح جرات مندانہ، لیکن زیادہ ورسٹائل۔

بہترین استعمال: روشن مگر متوازن لے آؤٹس

تثلیث

رنگ پہیہ کے ساتھ یکساں طور پر فاصلے پر تین رنگ، ہر ایک 120 ڈگری کے رنگ کے فرق کے ساتھ۔ بہتر ہے کہ ایک رنگ کو غالب ہونے دیں اور دوسروں کو بطور لہجہ استعمال کریں۔

بہترین استعمال: پُر لطف، توانائی سے بھرپور ڈیزائن

مشابہ

ایک ہی روشنی اور سنترپتی کے تین رنگ جو رنگ پہیہ پر ملحق ہیں، 30 ڈگری کے فرق کے ساتھ۔ ہموار منتقلی۔

بہترین استعمال: قدرت سے متاثر، پرسکون انٹرفیس

یک رنگی

ایک ہی رنگ کے تین رنگ جن کی روشنی کی قیمتیں +/-50% ہیں۔ لطیف اور نفیس۔

بہترین استعمال: سادہ، نفیس ڈیزائن

چوگنا

دو سیٹ تکمیلی رنگوں کے، جو 60 ڈگری کے رنگ کے فرق سے جدا ہوتے ہیں۔

بہترین استعمال: امیر، متنوع رنگ سکیمیں

رنگ کے اصول

توازن

ایک غالب رنگ استعمال کریں، ثانوی کے ساتھ مدد کریں، اور کم سے کم استعمال کریں۔

تضاد

پڑھنے کی صلاحیت اور رسائی کے لئے کافی تضاد کو یقینی بنائیں۔

ہم آہنگی

رنگوں کو ایک متحد بصری تجربہ پیدا کرنے کے لئے مل کر کام کرنا چاہئے۔

کلر کنٹراسٹ چیکر

رنگوں کے امتزاج کو جانچیں تاکہ یہ یقینی بنایا جا سکے کہ وہ متن کی پڑھنے کی صلاحیت کے لیے WCAG رسائی کے معیارات پر پورا اترتے ہیں۔

متن کا رنگ
پس منظر کا رنگ
کنٹراسٹ
1.00
Fail
بہت خراب
چھوٹا متن
✖︎
بڑا متن
✖︎
WCAG معیارات
AA:عام متن کے لیے کم از کم کنٹراسٹ تناسب 4.5:1 اور بڑے متن کے لیے 3:1۔ زیادہ تر ویب سائٹس کے لیے ضروری ہے۔
AAA:عام متن کے لیے 7:1 کا بہتر کنٹراسٹ تناسب اور بڑے متن کے لیے 4.5:1۔ بہترین رسائی کے لیے تجویز کردہ۔
تمام ٹیکسٹ سائز کے لیے ناکافی تضاد - WCAG معیارات پر پورا نہیں اترتا۔

ایڈوانسڈ کنٹراسٹ چیکر

سلائیڈرز، متعدد پیش نظارے اور مزید کے ساتھ باریک بینی سے ترتیب دیں

ہر کوئی ایک جینئس ہے۔ لیکن اگر آپ مچھلی کی قابلیت کو درخت پر چڑھنے کی بنیاد پر پرکھیں گے، تو وہ اپنی پوری زندگی یہ یقین کرتے ہوئے گزارے گی کہ وہ بے وقوف ہے۔

- Albert Einstein

تکنیکی فارمیٹس

عملی فارمیٹس

رنگ تجزیہ

بلائنڈنس سمیلیٹر

تخلیقی پہلو