تغميق لون hex بنسبة مئوية
احصل على درجة أعمق للون سداسي عشري دون تخمين: يصبح #4A90D9 بعد تغميقه 20 % هو #2873C0، بالتدرج والتشبع نفسيهما وإضاءة أقل. مع 0 % لا يتغير اللون، ومع 100 % يصبح أسود. مجاناً في متصفحك.
- مجاني
- يعمل في متصفحك
- دون تسجيل
- بياناتك لا تغادر جهازك
شغّل الأداة مجانًا
مثال محلول
- اللون
- #4A90D9
- الكمية
- 20
- الأصلي
- #4A90D9
- Hex
- #2873C0
يحتاج المصممون ومهندسو الواجهات ومؤلفو أنظمة التصميم باستمرار إلى درجات أغمق من لون العلامة لحالات التحويم والحدود والظلال والنصوص المقروءة على خلفيات فاتحة. وتخمين hex جديد بالعين بطيء وغير متسق بين الأدوات. تقبل هذه القدرة لون hex ونسبة تغميق من صفر إلى مئة، وتحوّل اللون إلى HSL، وتضرب الإضاءة في واحد ناقص تلك النسبة، وتُعيد hex الأغمق مع تفصيلي RGB وHSL. صفر بالمئة يُبقي اللون الأصلي؛ ومئة بالمئة تعطي الأسود.
ماذا يعني التغميق بنسبة مئوية في HSL
غالبًا ما تُخزَّن ألوان الويب على هيئة hex أو RGB، لكن خطوات الدرجة الإدراكية أسهل في HSL: الصبغة تحمل التلوين، والإشباع النقاء، والإضاءة مدى قرب العينة من الأسود أو الأبيض. التغميق بنسبة مئوية يعني خفض الإضاءة مع تثبيت الصبغة والإشباع، فيبقى أزرق العلامة أزرق — لكن أعمق. تضرب هذه الأداة الإضاءة الحالية في واحد ناقص المقدار على مئة.
عند صفر بالمئة تبقى الإضاءة دون تغيير، فيطابق الخرج hex المُدخل المُطبَّع. وعند خمسين بالمئة تُنصَّف الإضاءة. وعند مئة بالمئة تصير الإضاءة صفرًا فتكون النتيجة أسود خالصًا مهما كانت الصبغة الابتدائية.
ويطابق هذا النموذج النسبي طريقة تدرّج كثير من رموز التصميم لحالات التفاعل: رمز أساس واحد إضافةً إلى عامل تغميق للتحويم أو الضغط. أما الطرح المطلق لنقاط الإضاءة فقد يتجاوز الحد على الألوان الغامقة أصلًا؛ بينما التدريج النسبي يبقى في المجال دائمًا ولا يختلق إضاءة سالبة.
عقد الإدخال: ألوان hex والمقدار 0–100
مرّر اللون سلسلة hex بصورة قصيرة أو طويلة: #RGB أو #RRGGBB، مع علامة المربّع البادئة أو دونها. تتوسّع الصور القصيرة قناةً بقناة فيصير #F0A هو #FF00AA قبل التحويل. وحقل المقدار مطلوب ويجب أن يكون عددًا منتهيًا بين صفر ومئة شاملًا.
وتُرفض قيم مثل سالب عشرة أو مئة وواحد أو النص غير الرقمي؛ والتحقق الفاشل لا يُفوتر. عند النجاح تتضمن الاستجابة original وهو hex المُطبَّع بأحرف كبيرة من ست خانات، وhex نتيجة التغميق، والمقدار العددي الذي أرسلته، وrgb بقنوات صحيحة من صفر إلى مئتين وخمس وخمسين، وhsl بالصبغة بالدرجات والإشباع والإضاءة على مقياس من صفر إلى مئة بعد خطوة التغميق. والتقريب حتمي فلا ينحرف إعادة تشغيل الزوج نفسه.
استعمل المقدار صفرًا للتطبيع وتوسيع hex القصير دون تغيير الدرجة، أو المقدار مئة حين تحتاج مرساة سوداء حقيقية مشتقة من مسار الشيفرة نفسه الذي يشتق التغميق الجزئي.
لفحص سريع أو للوحة ألوان كاملة
لفحص عابر — تأكيد أن الأزرق الأساسي يُغمَّق بنظافة لتحويم زر، أو أن خطوة عشرين بالمئة ما زالت تحقق أهداف التباين مقابل الأبيض — استعمل أداة المتصفح المجانية في هذه الصفحة. ولا يوجد استدعاء شبكة داخل التحويل، ولا نموذج، ولا اعتماد على ساعة، فالنتائج آمنة على الحافة وقابلة للتخزين المؤقت. أدرج النقطة الطرفية في جسر إضافة Figma، أو إضافة Storybook تعاين ألوان الحالات، أو خطوة خادم تُجسّد أسطح الوضع الداكن من لوحة فاتحة.
وحين تحوّل الصيغ أصلًا بمحوّل ألوان منفصل، أبقِه لتحويلات HEX–RGB–HSL ذهابًا وإيابًا؛ واستعمل هذا المُغمّق حين يكون قصد البحث تحديدًا درجة أغمق بنسبة مئوية. اقرن الاثنين في خط معالجة إن احتجت تصدير CMYK بعد التغميق، لكن خطوة التغميق ذاتها لا تحتاج سوى hex داخلًا ولونًا مبنيَنًا خارجًا.
حالات الاستخدام
حالات التحويم والضغط في الواجهة
اشتق درجات أزرار وروابط أغمق من hex علامة واحد كي تبقى أنماط التحويم والتنشيط متسقة عبر المكوّنات دون انتقاء كل عينة يدويًا.
لمسات علامة البريد وPDF
احسب سلفًا درجات hex أغمق للحدود والعناوين في القوالب التي تقبل ألوانًا ثابتة فقط ولا تحسب HSL وقت العرض.
الأسئلة الشائعة
أي مُدخلات يقبل مُغمّق الألوان؟
لون hex (#RGB أو #RRGGBB، وعلامة # اختيارية) ونسبة مقدار من 0 إلى 100.
كيف يُحسب اللون الأغمق؟
يُحوَّل hex إلى HSL، وتُضرب الإضاءة في (1 − المقدار/100)، ثم يُحوَّل رجوعًا إلى hex وRGB وHSL. تبقى الصبغة والإشباع كما هما؛ والمقدار 100 يعطي الأسود.
ماذا تحوي الاستجابة الناجحة؟
original (hex المُدخل المُطبَّع)، وhex (نتيجة التغميق)، والمقدار، وrgb {r,g,b}، وhsl {h,s,l} بعد التغميق.
هل هذا كمحوّل صيغ الألوان؟
لا. المحوّل يغيّر التمثيل (HEX، RGB، HSL) دون إزاحة الدرجة. وهذه الأداة تُغمّق تحديدًا بخفض الإضاءة بنسبة مئوية.
ماذا يفعل تغميق بنسبة 20 % باللون #4A90D9؟
تنخفض إضاءته بمقدار الخُمس مع بقاء التدرج والتشبع، فتكون النتيجة #2873C0، أي RGB 40 و115 و192. يبقى الأزرق نفسه، لكنه أعمق.
أدوات ذات صلة
للمطوّرين — الوصول عبر API
كل ما في هذه الصفحة متاح برمجيًا. هذا القسم موجّه للفرق التقنية التي تريد ربط الأداة بأنظمتها الخاصة؛ بقية المستخدمين يمكنهم استخدام الأداة أعلاه مباشرة دون الحاجة لقراءة ما يلي.
الـEndpoint
صادِق على طلبك بترويسة Bearer، وأرسل طلب POST واحدًا لتدخل مهمتك قائمة التنفيذ فورًا؛ ثم تستلم النتيجة عبر webhook أو رابط موقّع.
استدعِ الخدمة من بيئتك
curl -X POST https://api.kit.forhosting.com/color/darken \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"color":"#4A90D9","amount":20}'const res = await fetch("https://api.kit.forhosting.com/color/darken", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"color": "#4A90D9",
"amount": 20
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/color/darken",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"color": "#4A90D9",
"amount": 20
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/color/darken", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"color":"#4A90D9","amount":20}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"color":"#4A90D9","amount":20}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/color/darken", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)مثال على الطلب
{
"color": "#4A90D9",
"amount": 20
}مثال على الاستجابة
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "color.darken",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}الواجهة غير متزامنة: تستلم task_id فور الإرسال، ويمكنك الاستعلام عن الحالة بمعدل طلب واحد في الثانية.
الأسعار
السعر معلن كما تراه: لا tokens ولا نظام نقاط؛ وإن فشلت المهمة فلن تُحاسَب عليها.
الأخطاء
| HTTP | الرمز | المعنى |
|---|---|---|
401 | unauthorized | مفتاح الوصول مفقود أو غير صالح؛ تحقق من ترويسة Bearer في طلبك. |
402 | insufficient_balance | رصيدك لا يكفي لتنفيذ هذه المهمة؛ أعد شحن الرصيد ثم أعد المحاولة. |
404 | unknown_type | نوع المهمة المطلوب غير موجود في الكتالوج — راجع الاسم المرسل في الطلب. |
429 | rate_limited | تجاوزت الحد المسموح من الطلبات؛ انتظر قليلًا ثم أعد المحاولة. |
ملاحظات تقنية
وتُرفض المقادير خارج صفر إلى مئة بخطأ invalid_input واضح. استعمل أداة المتصفح المجانية للعينات السريعة، أو API بسعر $0.002 لكل طلب ناجح حين تولّد لوحات ألوان في خط معالجة.
ماذا يعني التغميق بنسبة مئوية في HSL
ولأن التحويل رياضيات نقية بتقريب ثابت، ينتج hex والمقدار نفسهما دائمًا hex الأغمق نفسه في المتصفح وعلى حافة API، بما يجعل الاختبارات المرجعية والتشغيلات متعددة المناطق موثوقة للتكامل المستمر ورموز التصميم.
عقد الإدخال: ألوان hex والمقدار 0–100
وتفشل المحارف غير الصالحة والأطوال الخطأ والسلاسل الفارغة والقيم غير النصية بالخطأ invalid_input برسالة تسمّي الحقل. وتُقبل أسماء بديلة للتيسير: hex أو from أو text للّون، وpercent أو pct أو percentage للمقدار.
أين تُشغّلها: أداة المتصفح المجانية أو API الآلي
والدالة النقية نفسها تشغّل API حين تبني مولّدات سمات، أو تصدّر رموز تصميم إلى خصائص CSS مخصصة، أو تحسب سلفًا سلالم درجات لقوالب البريد التي لا تشغّل سكربتات العميل. يكلّف كل استدعاء API ناجح $0.002؛ والمقادير غير الصالحة خارج صفر إلى مئة وhex المشوّه لا يستهلكان الرصيد المدفوع مسبقًا.
حالات التكامل
سلالم درجات رموز التصميم
ولّد متغيرات داكنة متدرجة لمتغيرات CSS أو JSON السمات بتطبيق نِسب تغميق ثابتة على ألوان اللوحة الأساسية في التكامل المستمر.
أسئلة تقنية
كم يكلّف API؟
$0.002 لكل طلب ناجح. أداة المتصفح مجانية. والإدخال غير الصالح لا يُفوتر.