نام و کد رنگ های وب در HTML و CSS
در این بخش به معرفی فرمت رنگ ها و نحوه استفاده از آنها میپردازیم. فرمتهای مورد بررسی در این بخش شامل RGB, HEX, HSL, RGBA و HSLA هستند.
تفاوت فرمت رنگ های RGB و RGBA
- RGB دارای سه رنگ قرمز، سبز و آبی به عنوان ورودی است.
- RGBA علاوه بر سه رنگ قرمز، سبز و آبی به عنوان ورودی یک مقدار تحت عنوان آلفا نیز دریافت میکند که تعیین کننده میزان شفافیت است.
فرمت RGB
rgb(red, green, blue)
- برای سه ورودی قرمز، سبز و آبی میتوانیم مقادیر 0 تا 255 را تعیین کنیم تا از ترکیب آنها رنگ مدنظرمان را تعیین کنیم. به طور کلی با استفاده از این فرمت میتوان تعداد 256x256x256=16777216 رنگ تولید کرد.
- لازم به ذکر است که برای تولید رنگ مشکی از مقادیر صفر باید استفاده کنیم: rgb(0, 0, 0) و برای تولید رنگ سفید rgb(255, 255, 255)
مثال:
مثال RGBA
فرمت رنگی HEX
- رنگهای HEX به صورت rrggbb# مورد استفاده قرار میگیرند.
- مقادیر ورودی در بازه ff-00 قرار دارد که درواقع معادل 255-0 است.
- برای تولید رنگ مشکی از مقدار 000000# و برای تولید رنگ سفید از مقدار ffffff# استفاده میکنیم.
مثال:
کد رنگ HSL
hsl(hue, saturation, lightness)
- در این فرمت نیز سه مقدار را به عنوان ورودی دریافت میکنیم برای ورودی hue بازه رنگی 360-0 را داریم که 0 بیانگر قرمز، 120 رنگ سبز و 240 نیز آبی است که میتوان براساس مقدار این سه رنگ اصلی رنگ مدنظر را تولید کرد.
ورودی دوم saturation است که مقدار رنگ را براساس مقدار درصدی بیان میکند. 0% بیانگر رنگ طوسی است.
ورودی سوم نیز میزان نور رنگها را به صورت درصدی بیان میکند. 0% رنگ مشکی و 100% رنگ سفید است.