مشکی در rgb. آموزش HTML

ولاد مرژویچ

در HTML، رنگ به یکی از دو روش مشخص می شود: با استفاده از کد هگزادسیمال و با نام رنگ های خاص. روش مبتنی بر سیستم اعداد هگزادسیمال عمدتاً استفاده می شود، زیرا جهانی ترین است.

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

HTML از اعداد هگزادسیمال برای تعیین رنگ ها استفاده می کند. سیستم هگزادسیمال بر خلاف سیستم اعشاری، همانطور که از نامش پیداست، بر اساس عدد 16 است. اعداد به صورت زیر خواهد بود: 0، 1، 2، 3، 4، 5، 6، 7، 8، 9، A. , B, C , D, E, F. اعداد از 10 تا 15 با حروف لاتین جایگزین می شوند. روی میز 6.1 مطابقت بین اعداد اعشاری و هگزادسیمال را نشان می دهد.

اعداد بزرگتر از 15 در سیستم هگزادسیمال از ترکیب دو عدد در یک عدد تشکیل می شوند (جدول 6.2). به عنوان مثال، عدد 255 در اعشار با عدد FF در هگزادسیمال مطابقت دارد.

برای جلوگیری از سردرگمی در تعریف سیستم اعداد، قبل از یک عدد هگزادسیمال یک نماد هش #، به عنوان مثال #aa69cc قرار می گیرد. در این مورد، مورد مهم نیست، بنابراین نوشتن #F0F0F0 یا #f0f0f0 جایز است.

یک رنگ معمولی که در HTML استفاده می شود به این شکل است.

در اینجا رنگ پس زمینه صفحه وب روی #FA8E47 تنظیم شده است. نماد هش # در جلوی یک عدد به معنای هگزادسیمال بودن آن است. دو رقم اول (FA) جزء قرمز رنگ، رقم سوم تا چهارم (8E) جزء سبز و دو رقم آخر (47) جزء آبی را مشخص می‌کنند. نتیجه نهایی این رنگ خواهد بود.

F.A.

+

8E

+

47

=

FA8E47

هر یک از سه رنگ - قرمز، سبز و آبی - می توانند مقادیری از 00 تا FF داشته باشند که در مجموع 256 سایه ایجاد می کند. بنابراین، تعداد کل رنگ ها می تواند 256x256x256 = 16777216 ترکیب باشد. مدل رنگی مبتنی بر اجزای قرمز، سبز و آبی RGB (قرمز، سبز، آبی؛ قرمز، سبز، آبی) نامیده می شود. این مدل افزودنی است (از add - add) که در آن افزودن هر سه جزء رنگ سفید را تشکیل می دهد.

برای سهولت در پیمایش رنگ های هگزا دسیمال، برخی از قوانین را در نظر بگیرید.

• اگر مقادیر اجزای رنگ یکسان باشد (به عنوان مثال: #D6D6D6)، نتیجه یک رنگ خاکستری خواهد بود. هرچه این عدد بیشتر باشد، رنگ روشن تر است، با مقادیری از #000000 (سیاه) تا #FFFFFF (سفید).
• اگر جزء قرمز حداکثر (FF) باشد و اجزای باقیمانده روی صفر تنظیم شوند، یک رنگ قرمز روشن تشکیل می‌شود. رنگی با مقدار #FF0000 قرمزترین رنگ قرمز ممکن است. همین امر برای سبز (#00FF00) و آبی (#0000FF) صادق است.
• زرد (#FFFF00) از ترکیب قرمز و سبز ایجاد می شود. این به وضوح در چرخه رنگ قابل مشاهده است (شکل 6.1)، که رنگ های اصلی (قرمز، سبز، آبی) و مکمل یا اضافی را نشان می دهد. اینها شامل زرد، فیروزه ای و بنفش (همچنین سرخابی نامیده می شود). به طور کلی هر رنگی را می توان با مخلوط کردن رنگ های نزدیک به آن به دست آورد. بنابراین، فیروزه ای (#00FFFF) با ترکیب آبی و سبز به دست می آید.

برنج. 6.1. دایره رنگی

رنگ های مبتنی بر مقادیر هگزادسیمال نباید به صورت تجربی انتخاب شوند. برای این منظور یک ویرایشگر گرافیکی که می تواند با مدل های رنگی مختلف کار کند، مثلا Adobe Photoshop مناسب است. در شکل شکل 6.2 پنجره ای را برای انتخاب رنگ در این برنامه نشان می دهد؛ مقدار هگزادسیمال حاصل از رنگ فعلی با یک خط مشخص شده است. می توانید آن را کپی کرده و در کد خود جایگذاری کنید.

برنج. 6.2. پنجره ای برای انتخاب رنگ در فتوشاپ

رنگ های وب

اگر کیفیت رندر رنگ مانیتور را روی 8 بیت (256 رنگ) تنظیم کنید، می توان همان رنگ را در مرورگرهای مختلف به طور متفاوتی نمایش داد. این به دلیل نحوه نمایش گرافیک است، زمانی که مرورگر با پالت خود کار می کند و نمی تواند رنگی را نشان دهد که در پالت آن نیست. در این حالت، رنگ با ترکیبی از پیکسل‌های رنگ‌های نزدیک به آن جایگزین می‌شود که از رنگ داده شده تقلید می‌کنند. برای اطمینان از اینکه رنگ در مرورگرهای مختلف یکسان باقی می ماند، یک پالت به اصطلاح رنگ های وب معرفی شد. رنگ های وب آن دسته از رنگ هایی هستند که برای هر جزء - قرمز، سبز و آبی - به یکی از شش مقدار تنظیم شده است - 0 (00)، 51 (33)، 102 (66)، 153 (99)، 204 (CC) ، 255 (FF). مقدار هگزادسیمال این جزء در براکت نشان داده شده است. تعداد کل رنگ ها از همه ترکیب های ممکن 6x6x6 - 216 رنگ می دهد. یک نمونه رنگ وب #33FF66 است.

ویژگی اصلی رنگ وب این است که در همه مرورگرها یکسان به نظر می رسد. در حال حاضر ارتباط رنگ های وب به دلیل بهبود کیفیت مانیتورها و گسترش قابلیت های آنها بسیار کم است.

رنگ ها بر اساس نام

برای جلوگیری از به خاطر سپردن مجموعه ای از اعداد، می توانید به جای آن از نام رنگ های رایج استفاده کنید. روی میز 6.3 نام رنگ های محبوب را نشان می دهد.

جدول 6.3. نام چند رنگ

نام رنگ	رنگ	شرح	مقدار هگزادسیمال
سیاه		مشکی	#000000
آبی		آبی	#0000FF
فوشیا		بنفش روشن	#FF00FF
خاکستری		خاکستری تیره	#808080
سبز		سبز	#008000
اهک		سبز روشن	#00FF00
مارون		قرمز تیره	#800000
نیروی دریایی		آبی تیره	#000080
زیتون		زیتون	#808000
رنگ بنفش		بنفش تیره	#800080
قرمز		قرمز	#FF0000
نقره		خاکستری روشن	#C0C0C0
سبز رنگ		سبز آبی	#008080
سفید		سفید	#FFFFFF
رنگ زرد		رنگ زرد	#FFFF00

فرقی نمی کند که یک رنگ را با نام آن مشخص کنید یا با استفاده از اعداد هگزادسیمال. این روش ها از نظر تأثیر یکسان هستند. مثال 6.1 نحوه تنظیم رنگ پس زمینه و متن یک صفحه وب را نشان می دهد.

مثال 6.1. رنگ پس زمینه و متن

متن نمونه

در این مثال، رنگ پس‌زمینه با استفاده از ویژگی bgcolor تگ تنظیم می‌شود و رنگ متن از طریق ویژگی text. برای تنوع، ویژگی text روی یک عدد هگزا دسیمال و ویژگی bgcolor روی کلمه کلیدی رزرو شده teal تنظیم شده است.

>> مدیریت رنگ

مقادیر رنگ RGB هگزادسیمال

روش‌های توصیف و پردازش رنگ در نمایش نهایی آنها با یکدیگر متفاوت هستند. اجازه دهید برای مثال، نمایش رنگ‌ها را برای چاپ و نمایشگرهای رایانه مقایسه کنیم. در حالت اول، مبنا گرفته می شود سفیدرنگ کاغذی که بعداً سه رنگ اصلی روی آن اعمال می شود: آبی, رنگ بنفشو رنگ زرد. این سه رنگ اصلی با اختلاط با یکدیگر و با رنگ سفید کاغذ به نسبت های مختلف، سایه های رنگی متفاوتی به جز سیاه خالص می دهند یا در غیاب کامل رنگ کاغذ سفید می دهند. اگر رنگ مشکی را به آنها اضافه کنیم، می گیریم CMYK-روشی برای انتقال رنگ زمانی که رنگ مورد نیاز با کم کردن رنگ های از دست رفته از سفید بدست می آید.

در حالت دوم مبنا گرفته می شود سیاهرنگ صفحه نمایش مانیتور که هر سلول آن در یکی از سه رنگ می درخشد: قرمز-قرمز، سبز-سبز و آبی-آبی. سپس در غیاب کامل هیچ درخششی، یک رنگ صفحه سیاه خالص به دست می آید و هر یک از رنگ های مورد نیاز با نسبت هر یک از سه رنگ به دست می آید. در این صورت به دست خواهیم آورد RGB-روش انتقال رنگ رنگ های اولیه می تواند از 0 قبل از 255 ، یا از 0% قبل از 100% ، یا می تواند به عنوان یک مقدار هگزادسیمال نمایش داده شود. در شکل زیر نتایج اختلاط رنگ های اصلی را مشاهده می کنید.

سیستم اعداد هگزا دسیمال، بر خلاف سیستم اعداد اعشاری، دارای ده رقم نیست، بلکه شانزده رقم است - از این رو نام آن است. بر این اساس، فقط می توان انواع غیر تکراری ترکیبات دو رقمی وجود داشته باشد - 256 ، برای ادامه سری اعداد بعد 9 نامه هایی از آقبل از افبنابراین، سریال به این شکل خواهد بود -

0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F.

برای تبدیل اعداد از یک سیستم اعداد به سیستم اعداد دیگر و بالعکس، از ماشین حساب زیر استفاده کنید. حداکثر مقدار در اینجا می تواند باشد FF - 255 .

در این حالت رنگ با سه عدد هگزادسیمال مشخص می شود که هر کدام از دو رقم تشکیل شده است. عدد اول شدت را تعیین می کند قرمزرنگ ها، متوسط سبز، آخرین چیز- آبیرنگ ها همه اعداد می توانند مقادیری را در محدوده از 00 قبل از FF(از 0 تا 255). به عنوان مثال: رنگ سبز به عنوان داده شده است #00FF00، قرمز مانند #FF0000، آبی - مانند #0000FF، سفید مانند #FFFFFF، عدم وجود کامل رنگ یا سیاه به عنوان داده شده است #000000 .

در فرم زیر می توانید هر مقدار هگزادسیمال را برای هر یک از سه رنگ مشخص کنید و با کلیک در فیلد خروجی نتیجه اختلاط آنها را مشاهده کنید.

قرمز		سبز		آبی
	0 1 2 3 4 5 6 7 8 9 a b c d e f	0 1 2 3 4 5 6 7 8 9 a b c d e f	0 1 2 3 4 5 6 7 8 9 a b c d e f	0 1 2 3 4 5 6 7 8 9 a b c d e f	0 1 2 3 4 5 6 7 8 9 a b c d e f
...اینجا کلیک کنید

نمونه هایی از مقادیر رنگ RGB هگزادسیمال: درجه بندی قرمز، آبی و سبز.

چشم انداز	کد	چشم انداز	کد	چشم انداز	کد	چشم انداز	کد	چشم انداز	کد	چشم انداز	کد
	#010000		#800000		#000100		#008000		#000001		#000080
	#100000		#900000		#001000		#009000		#000010		#000090
	#200000		#A00000		#002000		#00A000		#000020		#0000A0
	#300000		#B00000		#003000		#00B000		#000030		#0000B0
	#400000		#C00000		#004000		#00C000		#000040		#0000C0
	#500000		#D00000		#005000		#00D000		#000050		#0000D0
	#600000		#E00000		#006000		#00E000		#000060		#0000E0
	#700000		#FF0000		#007000		#00FF00		#000070		#0000FF

تعیین رنگ با استفاده از String Literals

برای سهولت استفاده، به برخی از رنگ ها و ترکیبات آنها نام هایی اختصاص داده شد که توسط همه مرورگرها شناسایی می شوند و امکان تنظیم نام بسیاری از آنها وجود داشت. جدول زیر تعدادی از نام رنگ ها را نشان می دهد:

چشم انداز	نام	چشم انداز	نام	چشم انداز	نام	چشم انداز	نام
	سفید		قرمز		نارنجی		رنگ زرد
	سبز		آبی		رنگ بنفش		مشکی
	آلیس بلو		سفید عتیقه		آبی		آکوامارین
	لاجوردی		رنگ بژ		سوپ غلیظ خامه ای		بلانچدالموند
	بنفش آبی		رنگ قهوه ای		بوقلمون		کادبلو
	چارتروز		شکلات		مرجان		گل ذرت
	ابریشم ذرت		زرشکی		فیروزه ای		آبی تیره
	دارک سیان		تیره طلایی		خاکستری تیره		سبز تیره
	دارکخاکی		Darkmagenta		سبز زیتونی تیره		رنگ تیره
	دارکورچید		قرمز تیره		سالمون تیره		سبز تیره
	رنگ آبی تیره		خاکستری تیره		فیروزه ای تیره		بنفش تیره
	صورتی پررنگ		دیپ اسکای آبی		تیره رنگ		دوج بلو
	آجر نسوز		سفید گلی		جنگل سبز		فوشیا
	گینزبورو		گوست وایت		طلا		گلدنرود
	خاکستری		زرد سبز		عسلک		هات پینک
	سرخپوستی		نیل		عاج		خاکی
	اسطوخودوس		رژگونه اسطوخودوس		لیمونشیفون		آبی کمرنگ
	لایت کورال		لایت سیان		رنگ زرد روشن		سبز روشن
	خاکستری روشن		صورتی روشن		ماهی قزل آلا		لایت سیگرین
	آبی روشن		خاکستری لایت		لایت استیل آبی		زرد کمرنگ
	اهک		لیمو سبز		کتانی		ارغوانی
	مارون		مدیوم آکوامارین		آبی متوسط		مدیومورکید
	بنفش متوسط		سبز متوسط		رنگ آبی متوسط		بهار سبز متوسط
	فیروزه متوسط		بنفش متوسط		آبی نیمه شب		کرم نعنا
	Mistyrose		ناواهو سفید		نیروی دریایی		اولدلاس
	زیتون		الیوراب		نارنجی شده		ارکیده
	پالگولدنرود		سبز کمرنگ		پالت فیروزه		رنگ بنفش کمرنگ
	شلاق پاپایا		پفک هلو		پرو		رنگ صورتی
	آلو		آبی پودری		رزی براون		آبی سلطنتی
	زین قهوه ای		دریای سبز		صدف دریایی		سینا
	نقره		آبی آسمانی		تخته سنگی		اسلیت گری
	برف		بهارگرین		استیل آبی		قهوهای مایل به زرد
	آبی رنگ		خار مریم		گوجه فرنگی		فیروزه
	بنفش		گندم		دود سفید		سبز زرد

فهرست حروف کوچک با نام رنگ ها بسیار گسترده و بیش از اندازه کافی است. اگر نیاز به تنظیم رنگ پس زمینه دارید که آنقدر غیرعادی باشد که حتی نامی نداشته باشد، می توانید از یک مقدار هگزادسیمال استفاده کنید.

استفاده از پالت رنگ ایمن

متأسفانه، در پلتفرم های مختلف، با تنظیمات مختلف سیستم، بازتولید صحیح رنگ مشکل ساز است. نکته این است که مرورگر همیشه سعی می کند با مخلوط کردن مستقل رنگ ها و جایگزینی آنها، پالت رنگ سند را با تنظیمات سیستم و قابلیت های مانیتور تنظیم کند. در نتیجه گاهی اوقات کاربر دقیقاً آنچه را که مدیر وب می خواست به او نشان دهد نمی بیند. راه برون رفت از این وضعیت در استفاده از یک پالت یافت شد که هر رنگ آن تضمین شده است که به طور یکسان توسط همه مرورگرها در سیستم عامل های مختلف ارائه شود. این به اصطلاح است تضمینپالت، همچنین نامیده می شود بی خطرجعبه رنگ نقاشی. این پالت شامل رنگ هایی است که اجزای رنگ آنها مقادیر زیر را دارند: 00 ,33 ,66 ,99 , CC,FF، از همه راه های ممکن 216 ترکیبات آنها

FFFFFF CCCCCC 999999 666666 333333 000000 CCCC66 CCCC33 999966 999933 999900 666600 CCFF66 CCFF00 CCFF33 CCCC99 666633 333300 99FF00 99FF33 99CC66 99CC00 99CC33 669900 CCFF99 99FF99 66CC00 66CC33 669933 336600 66FF00 66FF33 33FF00 33CC00 339900 009900 33FF33 00FF33 00FF00 00CC00 33CC33 00CC33 CCFFCC 99CC99 66CC66 669966 336633 003300 99FF99 66FF66 33FF66 00FF66 339933 006600 66FF99 33FF99 00FF99 33CC66 00CC66 009933 66CC99 33CC99 00CC99 339966 009966 006633 99FFCC 66FFCC 33FFCC 00FFCC 33CCCC 009999 CCFFFF 99FFFF 66FFFF 33FFFF 00FFFF 00CCCC 99CCCC 66CCCC 339999 669999 006666 336666 66CCFF 33CCFF 00CCFF 3399 سی سی 0099CC 003333 99CCFF 3399FF 0099FF 6699 سی سی 336699 006699 0066FF 3366 سی سی 0066CC 0033FF 003399 003366 6699FF 3366FF 0000 FF 0000 سی سی 0033CC 000033 3333FF 3300 FF 3300 سی سی 3333 سی سی 000099 000066 9999 سی سی 6666FF 6666 سی سی 666699 333399 333366 CCCCFF 9999FF 6666FF 6600 FF 330099 330066 9966 سی سی 9966FF 6600 سی سی 6633 سی سی 663399 330033 CC99FF CC66FF 9933FF 9900 FF 660099 663366 CC66FF CC33FF CC00FF 9900 سی سی 996699 660066 CC99CC CC66CC CC33CC CC00CC 990099 993399 FFCCFF FF99FF FF66FF FF33FF FF00FF CC3399 FF66CC FF00CC FF33CC CC6699 CC0099 990066 FF99CC FF3399 FF0099 CC0066 993366 660033 FF6699 FF3399 FF0066 CC3366 996666 663333 CC9999 CC6666 CC3333 CC0000 990033 330000 FFCCCC FF9999 FF6666 FF3333 FF0000 CC0033 FF6633 CC3300 FF3300 FF0000 CC0000 990000 FFCC99 FFCC66 FF6600 CC6633 993300 660000 FF9900 FF9933 CC9966 CC6600 996633 663300 FFCC66 FFCC00 FFCC33 CC9900 CC9933 996600 FFFFCC FFFF99 FFFF66 FFFF33 FFFF00 CCCC00

چشم انداز	کد	چشم انداز	کد	چشم انداز	کد	چشم انداز	کد	چشم انداز	کد	چشم انداز	کد

در HTML رنگ را می توان به سه روش مشخص کرد:

تنظیم رنگ در HTML با نام آن

برخی از رنگ ها را می توان با نام آنها، با استفاده از نام رنگ در انگلیسی به عنوان مقدار مشخص کرد. رایج ترین کلمات کلیدی: سیاه، سفید، قرمز، سبز، آبی و غیره:

رنگ متن - قرمز

محبوب ترین رنگ های استاندارد کنسرسیوم وب جهانی (W3C):

رنگ	نام	رنگ	نام	رنگ	نام	رنگ	نام
	مشکی		خاکستری		نقره		سفید
	رنگ زرد		اهک		آبی		فوشیا
	قرمز		سبز		آبی		رنگ بنفش
	مارون		زیتون		نیروی دریایی		آبی رنگ

نمونه ای از استفاده از نام های رنگ های مختلف:

مثال: تعیین رنگ با نام آن

• خودت آن را امتحان کن "

هدر در پس زمینه قرمز

سربرگ در پس زمینه نارنجی

سر در زمینه آهکی

متن سفید در پس زمینه آبی

هدر در پس زمینه قرمز

سربرگ در پس زمینه نارنجی

سر در زمینه آهکی

متن سفید در پس زمینه آبی

تعیین رنگ با استفاده از RGB

هنگام نمایش رنگ های مختلف بر روی مانیتور، پالت RGB به عنوان پایه استفاده می شود. هر رنگی با مخلوط کردن سه رنگ اصلی به دست می آید: R - قرمز, G - سبز, ب - آبی. روشنایی هر رنگ با یک بایت داده می شود و بنابراین می تواند مقادیری از 0 تا 255 داشته باشد. برای مثال، RGB(255,0,0) به صورت قرمز نمایش داده می شود زیرا قرمز روی بالاترین مقدار خود (255) تنظیم شده است. بقیه روی 0 تنظیم شده اند همچنین می توانید رنگ را به صورت درصد تنظیم کنید. هر پارامتر میزان روشنایی رنگ مربوطه را نشان می دهد. به عنوان مثال: مقادیر rgb (127، 255، 127) و rgb (50٪، 100٪، 50%) همان رنگ سبز متوسط ​​را تنظیم می کنند:

مثال: تعیین رنگ با استفاده از RGB

• خودت آن را امتحان کن "

rgb(127، 255، 127)

rgb(50%, 100, 50%)

rgb(127، 255، 127)

rgb(50%, 100, 50%)

رنگ را با مقدار هگزادسیمال تنظیم کنید

ارزش های آر جی بهمچنین می توان با استفاده از مقادیر رنگی هگزا دسیمال (HEX) به این شکل مشخص کرد: #RRGGBB که در آن RR (قرمز)، GG (سبز) و BB (آبی) مقادیر هگزادسیمال از 00 تا FF هستند (همانند اعشاری 0-255). ) . سیستم هگزادسیمال بر خلاف سیستم اعشاری، همانطور که از نامش پیداست، بر پایه عدد 16 استوار است. A، B، C، D، E، F. در اینجا اعداد از 10 تا 15 با حروف لاتین جایگزین می شوند. اعداد بزرگتر از 15 در سیستم هگزادسیمال با ترکیب دو کاراکتر در یک مقدار نشان داده می شوند. به عنوان مثال، بالاترین عدد 255 در اعشار مربوط به بالاترین مقدار FF در هگزادسیمال است. برخلاف سیستم اعشاری، قبل از یک عدد هگزادسیمال یک نماد هش قرار می گیرد. # به عنوان مثال، #FF0000 به صورت قرمز نشان داده می شود زیرا قرمز روی بالاترین مقدار خود (FF) و بقیه رنگ ها روی حداقل مقدار خود (00) تنظیم شده اند. علائم بعد از نماد هش # می توانید با حروف بزرگ و کوچک تایپ کنید. سیستم هگزادسیمال به شما امکان می دهد از شکل اختصاری #rgb استفاده کنید که در آن هر کاراکتر معادل دو برابر است. بنابراین، ورودی #f7O باید به عنوان #ff7700 در نظر گرفته شود.

مثال: رنگ HEX

• خودت آن را امتحان کن "

قرمز: #FF0000

سبز: #00FF00

آبی: #0000FF

قرمز: #FF0000

سبز: #00FF00

آبی: #0000FF

قرمز+سبز=زرد: #FFFF00

قرمز+آبی=بنفش: #FF00FF

سبز+آبی=فیروزه ای: #00FFFF

لیست رنگ های رایج (نام، HEX و RGB):

نام انگلیسی	نام روسی	نمونه	HEX	RGB
آمارانت	آمارانت		#E52B50	229	43	80
کهربا	کهربا		#FFBF00	255	191	0
آبی	سبز آبی		#00FFFF	0	255	255
لاجوردی	لاجوردی		#007FFF	0	127	255
مشکی	مشکی		#000000	0	0	0
آبی	آبی		#0000FF	0	0	255
باندی آبی	آب ساحل بوندی		#0095B6	0	149	182
برنج	برنج		#B5A642	181	166	66
رنگ قهوه ای	رنگ قهوه ای		#964B00	150	75	0
سرولین	لاجوردی		#007BA7	0	123	167
سبز تیره بهاری	سبز تیره بهاری		#177245	23	114	69
زمرد	زمرد		#50C878	80	200	120
بادمجان	بادمجان		#990066	153	0	102
فوشیا	فوشیا		#FF00FF	255	0	255
طلا	طلا		#FFD700	250	215	0
خاکستری	خاکستری		#808080	128	128	128
سبز	سبز		#00FF00	0	255	0
نیل	نیل		#4B0082	75	0	130
یشم	یشم		#00A86B	0	168	107
اهک	اهک		#CCFF00	204	255	0
مالاکیت	مالاکیت		#0BDA51	11	218	81
نیروی دریایی	آبی تیره		#000080	0	0	128
اخر	اخر		#CC7722	204	119	34
زیتون	زیتون		#808000	128	128	0
نارنجی	نارنجی		#FFA500	255	165	0
هلو	هلو		#FFE5B4	255	229	180
كدو حلوايي	كدو حلوايي		#FF7518	255	117	24
رنگ بنفش	بنفش		#800080	128	0	128
قرمز	قرمز		#FF0000	255	0	0
زعفران	زعفران		#F4C430	244	196	48
سبز دریا	دریای سبز		#2E8B57	46	139	87
سبز باتلاق	بولوتنی		#ACB78E	172	183	142
آبی رنگ	سبز آبی		#008080	0	128	128
اولترامارین	اولترامارین		#120A8F	18	10	143
بنفش	بنفش		#8B00FF	139	0	255
رنگ زرد	رنگ زرد		#FFFF00	255	255	0

کدهای رنگ (پس زمینه) بر اساس اشباع و رنگ.

رنگ در CSS را می توان به روش های مختلفی تنظیم کرد:

• بر اساس اسم،
• با مقدار هگزادسیمال،
• در فرمت های RGB و RGBA
• در فرمت های HSL و HSLA.

رنگ را با نام تنظیم کنید

مرورگرها از تعیین برخی رنگ ها برای عناصر با نام پشتیبانی می کنند. این جدول حاوی چند کلمه کلیدی (نام رنگ انگلیسی) است که برای تعیین ویژگی های رنگ، کد RGB، کد هگزا دسیمال (HEX) و کد HSL استفاده می شود.

جدول 1. نام رنگ ها، کد RGB، HEX و HSL آنها.

نام	رنگ	RGB	HEX	HSL	شرح
سفید		rgb(255، 255، 255)	#ffffff یا #fff	hsl(0, 0, 100%)	سفید
نقره		rgb(192، 192، 192)	#c0c0c0	hsl(0, 0, 75%)	خاکستری
خاکستری		rgb(128، 128، 128)	#808080	hsl(0, 0, 50%)	خاکستری تیره
سیاه		rgb(0، 0، 0)	#000000 یا #000	hsl(0, 0, 0%)	مشکی
مارون		rgb(128، 0، 0)	#800000	hsl(0, 100, 25%)	قرمز تیره
قرمز		rgb(255، 0، 0)	#ff0000 یا #f00	hsl(0, 100, 50%)	قرمز
نارنجی		rgb(255، 165، 0)	#ffa500	hsl(38.8، 100، 50%)	نارنجی
رنگ زرد		rgb(255، 255، 0)	#ffff00 یا #ff0	hsl(60، 100، 50%)	رنگ زرد
زیتون		rgb(128، 128، 0)	#808000	hsl(60، 100، 25%)	زیتون
اهک		rgb(0، 255، 0)	#00ff00 یا #0f0	hsl(120, 100, 50%)	سبز روشن
سبز		rgb(0، 128، 0)	#008000	hsl(120، 100، 25%)	سبز
آبی		rgb(0, 255, 255)	#00ffff یا #0ff	hsl(180، 100، 50%)	آبی
آبی		rgb(0، 0، 255)	#0000ff یا #00f	hsl(240، 100، 50%)	آبی
نیروی دریایی		rgb(0,0,128)	#000080	hsl(240، 100، 25%)	آبی تیره
سبز رنگ		rgb(0، 128، 128)	#008080	hsl(180، 100، 25%)	سبز آبی
فوشیا		rgb(255، 0، 255)	#ff00ff یا #f0f	hsl(300، 100، 50%)	رنگ صورتی
رنگ بنفش		rgb(128، 0، 128)	#800080	hsl(300، 100، 25%)	بنفش

این نمونه ای از استفاده از نام رنگ ها است، نام رنگ ها از جدول توسعه یافته گرفته شده است.

در اینجا نحوه کار این کد آمده است:

تنظیم رنگ با استفاده از RGB

RGB یک مدل رنگ افزودنی است. به انگلیسی علاوه بر این- اضافه RGB مخفف کلمات انگلیسی است: قرمز، سبز، آبی - قرمز، سبز، آبی). از اینجا مشخص می شود که در مدل RGB، رنگ ها با افزودن سه رنگ (قرمز، سبز، آبی) در مقادیر مختلف سنتز می شوند.

با ترکیب رنگ های قرمز، سبز و آبی می توانید چندین میلیون سایه به دست آورید. تمام ترکیبات ممکن در حافظه کامپیوتر ذخیره می شوند.

برو سر اصل مطلب.

برای تنظیم خصوصیات در این قالب، از علامت rgb(r، g، b) استفاده کنید، که در آن r، g، b سه کانال برای هر رنگ (قرمز، سبز، آبی) هستند. مقادیر برای هر کانال در محدوده 0 تا 255 تنظیم شده است.

کد نمونه

برای روشن شدن همه چیز، در اینجا یک مثال کد آورده شده است:

این مثال چگونه باید کار کند:

عکس. 1. رنگ ها در RGB

برای مثال توضیحات

در ابتدای صفحه کلاس div.rgb را ایجاد می کنیم، برای بلوک های ایجاد شده توسط تگ مورد نیاز است

بهترین مقالات در این زمینه