ForHosting KIT · أدوات المطورين

مصفوفة تباين لوحة الألوان

قد تبدو لوحة الألوان متناسقة، ومع ذلك تتضمن تركيبات تجعل النص صعب القراءة أو مستحيل القراءة.

● Betaمجاني · داخل متصفحك

استخدمها من الويبAPIالبريدTelegramالتطبيق قريبًا

تحسب هذه المصفوفة النصوع النسبي وفق WCAG 2 لكل لون سداسي مقدم، وتقارن جميع الألوان بعضها ببعض، ثم تعيد النتائج في مصفوفة مربعة ثابتة. يستطيع المصممون والمطورون ومراجعو سهولة الوصول فحص لوحة نظام تصميم كاملة دفعة واحدة بدلا من اختبار كل زوج منفردا. يجري التحقق من المدخلات وتوحيد صيغ الألوان، وتناسب النتيجة الحتمية عمليات التدقيق المؤتمتة والتقارير ذات الإصدارات المحفوظة.

اقرأ المصفوفة مع الحفاظ على ارتباطها بالألوان

أرسل مصفوفة تضم من لونين إلى مئة لون سداسي. تقبل الصيغ ذات الثلاثة أرقام أو الستة، مع علامة المربع في البداية أو من دونها، ويوحد كل إدخال صالح إلى رمز من ستة أرقام بأحرف صغيرة. تسرد الاستجابة الألوان الموحدة بالترتيب نفسه وتمنح كل لون فهرسا. تستخدم صفوف المصفوفة وأعمدتها ذلك الترتيب بدقة، ولذلك تصف القيمة في الصف الثاني والعمود الخامس التباين بين اللونين ذوي الفهرسين اثنين وخمسة. تكون قيمة القطر دائما 1 لأن اللون لا يتباين مع نفسه، كما تكون المصفوفة متناظرة لأن تبديل المقدمة والخلفية لا يغير نسبة التباين وفق WCAG. تقرب كل نسبة معروضة إلى منزلتين عشريتين للحصول على خرج مقروء وثابت، وتقرب قيم النصوع إلى ست منازل. تبقى الألوان المكررة مواضع مستقلة، مما يفيد عند تدقيق رموز تصميم تشترك في القيمة وتختلف في الدور الدلالي. يسهل هذا التنظيم عرض الاستجابة كجدول أو حفظها دليلا للتدقيق أو مقارنتها بين الإصدارات.

افهم حساب WCAG وحدوده المرجعية

يتبع الحساب طريقة النصوع النسبي في WCAG 2 لألوان sRGB. تحول كل قناة حمراء وخضراء وزرقاء من قيمة sRGB المرمزة إلى ضوء خطي، ثم تدمج وفق معاملات النصوع القياسية. لأي زوج، يقسم النصوع الأفتح مضافا إليه 0.05 على النصوع الأغمق مضافا إليه 0.05، فتنتج نسبة من 1 إلى 21. تتضمن الاستجابة الحدود المعروفة: 4.5 للنص العادي AA، و7 للنص العادي AAA، و3 للنص الكبير AA، و4.5 للنص الكبير AAA. قارن خلايا المصفوفة بالحد الملائم للمحتوى والخط الفعليين. لا تكفي النسبة وحدها لإعلان واجهة كاملة سهلة الوصول، إذ يظل حجم الخط ووزنه وحالات التفاعل والعناصر غير النصية وسياق المستخدم عوامل مهمة. لذلك تعيد الأداة أدلة رقمية بدلا من حكم عام بالنجاح أو الفشل. يتيح ذلك للتدقيق تطبيق القاعدة الصحيحة على كل اقتران مقصود، ويمنع اعتبار القيمة المعروضة بعد التقريب ضمانا أشمل لسهولة الوصول.

استخدم النتائج الحتمية في تدقيق أنظمة التصميم

تزداد فائدة المصفوفة الكاملة عندما يكون فحص اللوحة قابلا للتكرار. حافظ على ترتيب موثق، مثل الألوان المحايدة ثم رموز العلامة والحالة والتمييز، واحفظ المصفوفة المعادة مع إصدار نظام التصميم. يمكن لاختبار التكامل المستمر مقارنة خلايا مختارة بالحدود المطلوبة، بينما يستطيع المراجع فحص الجدول كاملا بحثا عن تركيبات ضعيفة غير متوقعة. لأن الخوارزمية لا تستخدم الشبكة أو العشوائية أو الوقت الحالي أو أنماط المتصفح أو تخمين ملفات تعريف الألوان، ينتج إدخال JSON المتطابق خرج JSON متطابقا. ترفض أشكال المصفوفات غير الصالحة واللوحات خارج الحجم المدعوم والقيم السداسية الخاطئة مع تحديد فهرس واضح. يقيد حد المئة لون المصفوفة التربيعية بعشرة آلاف خلية. عالج الشفافية والتركيب قبل استدعاء القدرة؛ فالألوان ذات قناة ألفا مرفوضة لأن مظهرها يعتمد على الخلفية. كذلك حول أسماء الألوان وHSL وقيم النطاق الواسع وكائنات أدوات التصميم إلى hex sRGB معتم أولا، لكي يستند كل تدقيق إلى أساس لوني صريح وقابل لإعادة الإنتاج.

حالات الاستخدام

تدقيق رموز التصميم

أنشئ مصفوفة مفهرسة لرموز العلامة والأسطح والنص والحدود والحالات قبل نشر إصدار من نظام التصميم.

فحص ترحيل السمات

قارن المصفوفات الناتجة عن اللوحتين القديمة والجديدة لاكتشاف التركيبات التي ضعف تباينها أثناء إعادة التصميم.

أتمتة مراجعة سهولة الوصول

مرر نسبا ثابتة إلى قواعد التكامل المستمر التي تفرض حد WCAG الملائم على أزواج الرموز المعتمدة.

الأسئلة الشائعة

ما تكلفة الطلب الواحد؟

السعر الأساسي لواجهة API هو $0.002 لكل طلب.

ما صيغ الألوان المقبولة؟

تقبل ألوان sRGB السداسية المعتمة ذات الثلاثة أرقام أو الستة، مع علامة المربع في البداية أو من دونها. ترفض قناة ألفا والأسماء وHSL وصيغ النطاق الواسع.

كيف ترتبط الصفوف والأعمدة بالألوان؟

يتبع المحوران ترتيب الإدخال الأصلي. يتضمن كل لون معاد فهرسه، وتمثل matrix[row][column] نسبة اللونين ذوي الفهرسين المقابلين.

لماذا تساوي كل قيمة قطرية 1؟

يملك اللون النصوع نفسه عند مقارنته بذاته، ولذلك تنتج صيغة تباين WCAG دائما نسبة تساوي 1.

هل تثبت النسبة أن التصميم سهل الوصول؟

لا. فهي تقدم دليل تباين الألوان المستخدم في فحوص WCAG، لكن سهولة الوصول تعتمد أيضا على الخط والحالات والمحتوى والاستخدام الصحيح لكل زوج.

للمطوّرين — الوصول عبر API

كل ما في هذه الصفحة متاح برمجيًا. هذا القسم موجّه للفرق التقنية التي تريد ربط الأداة بأنظمتها الخاصة؛ بقية المستخدمين يمكنهم استخدام الأداة أعلاه مباشرة دون الحاجة لقراءة ما يلي.

الـEndpoint

POSThttps://api.kit.forhosting.com/color/palette-contrast-matrix

صادِق على طلبك بترويسة Bearer، وأرسل طلب POST واحدًا لتدخل مهمتك قائمة التنفيذ فورًا؛ ثم تستلم النتيجة عبر webhook أو رابط موقّع.

استدعِ الخدمة من بيئتك

curl -X POST https://api.kit.forhosting.com/color/palette-contrast-matrix \
  -H "Authorization: Bearer $KIT_KEY" \
  -H "Content-Type: application/json" \
  -d '{"colors":["#ffffff","#111827","#2563eb","#facc15"]}'

const res = await fetch("https://api.kit.forhosting.com/color/palette-contrast-matrix", {
  method: "POST",
  headers: {
    "Authorization": `Bearer ${process.env.KIT_KEY}`,
    "Content-Type": "application/json"
  },
  body: JSON.stringify({
    "colors": [
      "#ffffff",
      "#111827",
      "#2563eb",
      "#facc15"
    ]
  })
});
const { task_id } = await res.json();

import os, requests

res = requests.post(
    "https://api.kit.forhosting.com/color/palette-contrast-matrix",
    headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
    json={
    "colors": [
        "#ffffff",
        "#111827",
        "#2563eb",
        "#facc15"
    ]
},
)
task_id = res.json()["task_id"]

<?php
$res = file_get_contents("https://api.kit.forhosting.com/color/palette-contrast-matrix", false, stream_context_create([
  "http" => [
    "method"  => "POST",
    "header"  => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
    "content" => '{"colors":["#ffffff","#111827","#2563eb","#facc15"]}',
  ],
]));
$task = json_decode($res, true);

body := bytes.NewBufferString(`{"colors":["#ffffff","#111827","#2563eb","#facc15"]}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/color/palette-contrast-matrix", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)

مثال على الطلب

{
  "colors": [
    "#ffffff",
    "#111827",
    "#2563eb",
    "#facc15"
  ]
}

مثال على الاستجابة

{
  "task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
  "type": "color.palette_contrast_matrix",
  "status": "queued",
  "_links": {
    "result": "/tasks/tsk_…/result"
  }
}

الواجهة غير متزامنة: تستلم task_id فور الإرسال، ويمكنك الاستعلام عن الحالة بمعدل طلب واحد في الثانية.

الأسعار

لكل طلب$0.002

السعر معلن كما تراه: لا tokens ولا نظام نقاط؛ وإن فشلت المهمة فلن تُحاسَب عليها.

الحدود

max_items 100

الأخطاء

HTTP	الرمز	المعنى
`401`	`unauthorized`	مفتاح الوصول مفقود أو غير صالح؛ تحقق من ترويسة Bearer في طلبك.
`402`	`insufficient_balance`	رصيدك لا يكفي لتنفيذ هذه المهمة؛ أعد شحن الرصيد ثم أعد المحاولة.
`404`	`unknown_type`	نوع المهمة المطلوب غير موجود في الكتالوج — راجع الاسم المرسل في الطلب.
`429`	`rate_limited`	تجاوزت الحد المسموح من الطلبات؛ انتظر قليلًا ثم أعد المحاولة.

اطّلع على توثيق KIT الكامل ←