Hex | رنگ هگزادسیمال

هگز، کوتاه‌شدهٔ رنگ هگزادسیمال، روش استاندارد نمایش رنگ در طراحی دیجیتال است: معمولاً یک علامت مربع به‌همراه شش نویسهٔ شانزده‌شانزده‌ای مانند #FFFFFF برای سفید یا #000000 برای سیاه. هر جفت نویسه یک کانال قرمز، سبز یا آبی را در فضای RGB مشخص می‌کند و با ترکیب آن‌ها رنگ نهایی ساخته می‌شود. این نمادگذاری به طراح و توسعه‌دهنده اجازه می‌دهد سایهٔ دقیق را در ابزار طراحی، راهنمای برند، CSS و کد تولید با یک رشتهٔ کوتاه و یکسان به اشتراک بگذارند. تمرکز این مدخل روی نمادگذاری و کاربرد عملی کد رنگ است، نه نظریهٔ فام یا چرخهٔ رنگ که در مدخل‌های دیگر بررسی می‌شود.

ساختار #RRGGBB؛ سه جفت برای سه کانال

پایهٔ شانزده از ارقام صفر تا نه و حروف A تا F استفاده می‌کند. هر جفت مقداری از 00 تا FF دارد که در دهدهی صفر تا دویست‌وپنجاه‌وپنج است. جفت اول قرمز، جفت دوم سبز، جفت سوم آبی را کنترل می‌کند. #FF0000 قرمز خالص، #00FF00 سبز خالص، #0000FF آبی خالص است. ترکیب مقادیر میانی میلیون‌ها سایه می‌سازد—بیش از شانزده میلیون حالت در مدل هشت‌بیتی رایج—که برای تقریباً همهٔ نیازهای رابط دیجیتال کافی است.

شکل کوتاه سه‌نویسه مانند #RGB وقتی هر جفت رقم تکراری باشد مجاز است؛ #FFFFFF را می‌توان #FFF نوشت. مرورگر آن را به شش‌رقمی گسترش می‌دهد. شکل هشت‌نویسه با آلفا (#RRGGBBAA) در CSS مدرن شفافیت را هم کد می‌کند، هرچند پشتیبانی و قرارداد تیم باید روشن باشد. مهم این است که تیم یک قالب مرجع در سیستم طراحی قفل کند تا فایل‌ها مخلوط شش و هشت نویسهٔ بی‌قانون نشوند.

زبان مشترک طراحی، توسعه و برند

بدون کد دقیق، «آبی برند» در فیگما، در اسلاید بازاریابی و در CSS سه چیز متفاوت از آب درمی‌آید. تعریف رنگ اصلی به‌صورت مثلاً یک آبی مشخص در راهنما، پروتوتایپ و توکن‌های تم، یکپارچگی بصری را حفظ می‌کند و فرسایش هویت را کم می‌نماید. طراح کد را کپی می‌کند؛ مهندس همان را در متغیر یا توکن می‌نشاند؛ بازاریابی همان را در قالب ایمیل و بنر به‌کار می‌برد.

ابزارهایی مانند Figma و Adobe XD ورود و برداشتن هگز را پیش‌فرض کرده‌اند. در HTML و CSS ویژگی رنگ با هگز، RGB، یا نام‌های محدود کار می‌کند؛ هگز به‌خاطر فشردگی و فراگیری محبوب مانده است. در تحویل طراحی، چسباندن هگز کنار نمونه‌رنگ ابهام «نزدیک همان سایه» را از بین می‌برد و بازبینی پیکسلی را کوتاه می‌کند.

کنتراست، دسترس‌پذیری و جفت رنگ‌ها

خوانایی متن و کنترل‌ها به نسبت کنتراست پیش‌زمینه و پس‌زمینه وابسته است و محاسبه از روی مقادیر روشنایی نسبی همان رنگ‌هایی است که اغلب به‌صورت هگز ذخیره شده‌اند. متن سیاه روی سفید حداکثر کنتراست می‌دهد؛ خاکستری روشن روی خاکستری کمی تیره‌تر ممکن است در آزمون WCAG مردود شود. طراح باید جفت هگز را با ابزار کنتراست بسنجد نه با حدس چشمی روی مانیتور کالیبره‌نشده.

در سیستم طراحی، توکن‌های معنایی—رنگ متن اصلی، رنگ سطح، رنگ خطر—به‌جای هگز خام پراکنده در فایل‌ها، کنتراست را یک‌بار تضمین و همه‌جا مصرف می‌کنند. تغییر برند سپس با تعویض مقدار توکن انجام می‌شود نه شکار رشته‌های هگز در صدها فایل. با این حال فهم هگز برای اشکال‌زدایی و همکاری با تیم‌هایی که هنوز توکن کامل ندارند ضروری می‌ماند.

هگز در کنار RGB، HSL و نام رنگ‌ها

RGB همان اطلاعات را با سه عدد دهدهی می‌گوید؛ هگز همان را فشرده و قابل‌کپی می‌کند. HSL رنگ را با فام، اشباع و روشنی توصیف می‌کند و برای تنظیم تدریجی در کد گاهی راحت‌تر است، اما برای قفل برند و اشتراک سریع، هگز همچنان استاندارد عملی بسیاری از تیم‌هاست. نام‌های CSS مانند blue مبهم و محدودند و برای برند دقیق کافی نیستند.

فضای هگز همان فضای RGB نمایشگر است؛ رنگ‌های خارج از این فضا یا مدل‌های چاپ مانند CMYK و پنتون را پوشش نمی‌دهد. برای کار چاپی ممکن است تبدیل و پروفایل رنگ جدا لازم شود. در محصول دیجیتال، هگز معمولاً مرجع اصلی است و بحث فام نظری—جایی روی چرخهٔ رنگ—لایهٔ مفهومی جداگانه‌ای است که با نمادگذاری #RRGGBB یکی نیست.

توکن، تم روشن و تیره، و انضباط نام‌گذاری

ذخیرهٔ مستقیم هگز کنار هر مؤلفه بدهی می‌سازد. الگوی بالغ: هگز خام در لایهٔ پایهٔ پالت، سپس توکن معنایی که به آن پالت اشاره می‌کند، سپس مؤلفه که فقط توکن می‌بیند. تم تیره با نگاشت دوبارهٔ توکن‌ها کار می‌کند نه با جست‌وجوی دستی هر # کد. مستند برند باید هگزهای رسمی، کاربرد مجاز، و جفت‌های تأییدشدهٔ کنتراست را فهرست کند.

اشتباهات رایج عبارتند از: تقریبی گرفتن سایه از چشم، مخلوط کردن هگز با و بدون هش، نادیده گرفتن آلفا، و فرض اینکه یک کد روی همهٔ صفحه‌نمایش‌ها یکسان «حس» می‌شود—کالیبراسیون فرق دارد، اما قرارداد یکسان همچنان بهترین نقطهٔ شروع است. آزمون روی دستگاه‌های واقعی برای رنگ‌های مرزی برند عاقلانه است.

جمع‌بندی عملی برای تیم محصول

هگز ابزار دقت و هماهنگی است: شش نویسه که سایه را قفل می‌کند، میان رشته‌ها پل می‌زند، و پایهٔ سنجش کنتراست را می‌سازد. جایگزین‌هایی مثل HSL برای ویرایش برنامه‌ای مفیدند، اما حذف هگز از گردش‌کار وب و طراحی رابط به‌ندرت منطقی است. تیمی که پالت را با هگز مستند کند، توکن کند، و جفت‌های دسترس‌پذیر را قفل نماید، کمتر با «این رنگ با ماکت فرق دارد» در زمان انتشار غافلگیر می‌شود و بیشتر انرژی را صرف سلسله‌مراتب و معنا می‌کند تا جدل بر سر سایهٔ تقریبی.

گردش‌کار روزمره: از قطره‌چکان تا متغیر

مسیر معمول این است که طراح رنگ را در ابزار انتخاب می‌کند، هگز را کپی می‌کند، در مستند یا توکن می‌نشاند، و مهندس همان مقدار را به متغیر CSS یا ثابت تم می‌سپارد. در بازبینی، اختلاف یک رقم در هگز می‌تواند سایه را عوض کند؛ بنابراین مقایسهٔ رشته‌ای دقیق بهتر از «تقریباً همان» است. برای حالت هاور و غیرفعال، بهتر است از الگوریتم روشن/تیره‌سازی روی توکن پایه استفاده شود تا ده‌ها هگز دستی پراکنده. نسخه‌های سه و هشت نویسه را در راهنمای تیم صریح کنید تا کسی #RGB را با #RRGGBBAA اشتباه نگیرد.

در ایمیل HTML و برخی محیط‌های قدیمی، پشتیبانی از فرمت‌های رنگ محدودتر است و هگز شش‌رقمی امن‌ترین انتخاب می‌ماند. در طراحی همزمان وب و اپ بومی، همان هگز مرجع برند باید به فضای رنگ پلتفرم ترجمه شود؛ گاهی ابزار تبدیل لازم است اما منبع حقیقت همچنان پالت مستندشده است. برای دارایی‌های بازاریابی خارج از محصول—اسلاید، شبکهٔ اجتماعی، بنر—همان جدول هگز برند از واگرایی تدریجی جلوگیری می‌کند.

انضباط کوچک، یکپارچگی بزرگ

یادگیری خواندن سریع هگز—تشخیص تقریبی روشنی از بزرگی ارقام، و فهم کانال غالب—به نقد طراحی سرعت می‌دهد، هرچند ابزار قطره‌چکان همچنان دقیق‌تر است. در آموزش فرانت‌اند، اتصال هگز به متغیرهای CSS و حالت‌های هاور و غیرفعال، حلقهٔ طراحی تا تولید را کامل می‌کند. رنگ هگزادسیمال ساده به نظر می‌رسد؛ انضباط استفاده از آن تفاوت میان برند یکدست و وصله‌های رنگی پراکنده است. تیمی که هگز را جدی بگیرد—مستند، توکن‌شده، و از نظر کنتراست تأییدشده—کمتر زمان صرف بحث سایه می‌کند و بیشتر صرف معنا و سلسله‌مراتب رابط. یک جدول پالت با نام نقش، هگز، و وضعیت کنتراست روی متن، مرجع روزمرهٔ طراحی و توسعه است.