هر ۱۴۰ رنگ نام‌دار استاندارد CSS/HTML را در یک شبکهٔ نمونهٔ زیبا مرور کنید — بر اساس نام یا هگز جستجو کنید، بر اساس خانوادهٔ رنگ فیلتر کنید و مقدار هگز، rgb() یا hsl() هر رنگ را با یک کلیک کپی کنید. در مرورگر، رایگان.

هر ۱۴۰ رنگ نام‌دار استاندارد CSS/HTML، با مقادیر هگز، RGB و HSL آن‌ها. همه‌چیز در مرورگر شما از یک مرجع داخلی اجرا می‌شود — چیزی به سرور ارسال نمی‌شود.

هیچ رنگی با جستجوی شما مطابقت ندارد.
یک نام یا هگز دیگر را امتحان کنید — مثلاً RebeccaPurple، #00FF00 یا teal.

درباره نام رنگ‌های HTML

این مرجع تمام 140 رنگ نام‌گذاری‌شده استاندارد CSS/HTML را ارائه می‌دهد؛ فهرست کاملی که مرورگرها می‌فهمند، از AliceBlue تا YellowGreen؛ به‌صورت شبکه نمونه‌رنگ واکنش‌گرا. هر نمونه‌رنگ خود رنگ را همراه با نام و مقدار هگزادسیمالش نشان می‌دهد، و کلیک روی آن اشکال هگز، rgb() و hsl() آن را باز می‌کند، هرکدام با یک کلیک قابل کپی.

می‌توانید بر اساس نام یا مقدار هگزادسیمال جستجو کنید؛ Tomato و #FF6347 به یک نمونه‌رنگ می‌رسند؛ و بر اساس خانواده فیلتر کنید: Reds، Pinks، Oranges، Yellows، Browns، Greens، Cyans، Blues، Purples، Whites و Grays & Blacks. نمای خانواده سریع‌ترین راه برای کوتاه‌کردن فهرست نامزدها زمانی است که تقریباً رنگ موردنظر را می‌دانید.

رنگ‌های نام‌گذاری‌شده برای نمونه‌های اولیه، مثال‌های کد، پرکردن‌های SVG و آموزش مفید هستند، چون نامی مانند RebeccaPurple قصد را بهتر از یک سه‌تایی هگزادسیمال منتقل می‌کند. مقادیر RGB و HSL در مرورگر شما از هگز هر رنگ استخراج می‌شوند، و چیزی که جستجو می‌کنید به سرور ارسال نمی‌شود.

نحوه استفاده از نام رنگ‌های HTML

  1. بر اساس نام رنگ یا مقدار هگزادسیمال جستجو کنید؛ برای مثال Tomato، teal یا #00FF00.
  2. بر اساس خانواده فیلتر کنید؛ Reds، Blues، Grays و مانند آن؛ تا رنگ‌ها را در یک محدوده رنگی کوتاه کنید.
  3. روی یک نمونه‌رنگ کلیک کنید تا مقدار هگزادسیمال آن فوراً کپی شود.
  4. پاپ‌آور نمونه‌رنگ را باز کنید تا در عوض شکل rgb() یا hsl() را کپی کنید.

سوالات متداول

140 رنگ نام‌گذاری‌شده استاندارد در CSS مدرن وجود دارد که 16 رنگ اصلی HTML را با فهرست بزرگ‌تر مشتق‌شده از X11 گسترش می‌دهد. هر مرورگر فعلی از همه آن‌ها در هر ویژگی‌ای که رنگ می‌پذیرد پشتیبانی می‌کند.

خیر. tomato، Tomato و TOMATO همگی معتبر و در CSS و HTML یکسان هستند. اشکال camel-case نشان‌داده‌شده اینجا صرفاً املای متعارفی است که نام‌های چندکلمه‌ای مانند LightGoldenrodYellow را خواناتر می‌کند.

نام‌ها برای مثال‌ها، نمونه‌های اولیه و لهجه‌های یک‌باره عالی هستند؛ پالت‌های تولیدی معمولاً در ویژگی‌های سفارشی با مقادیر هگز، rgb() یا hsl() زندگی می‌کنند، چون رنگ‌های سیستم طراحی به‌ندرت دقیقاً با یک رنگ نام‌گذاری‌شده مطابقت دارند. از نظر عملکردی، یک نام و هگز آن قابل تعویض هستند.

CSS هر دو املا را برای gray و مشتقاتش شامل می‌شود؛ gray/grey، darkgray/darkgrey و مانند آن؛ و هر جفت را به همان مقدار نگاشت می‌کند، بنابراین هیچ‌کدام از املاها اشتباه نیست.

بله. هر 140 نمونه‌رنگ، جستجو، فیلترهای خانواده و کپی هگز/rgb()/hsl() رایگان هستند و کاملاً در مرورگر شما اجرا می‌شوند.

اشتراک‌گذاری
به کمک نیاز دارید؟
با این ابزار مشکلی پیدا کردید؟ به تیم ما اطلاع دهید.
گزارش مشکل

این ابزار رایگان را به وب‌سایت خود اضافه کنید — کد زیر را کپی و جای‌گذاری کنید.