Spaces:
Running on CPU Upgrade
Running on CPU Upgrade
Fetching metadata from the HF Docker repository...
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>About - QIMMA Leaderboard</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script src="https://unpkg.com/lucide@latest"></script> | |
| <script> | |
| tailwind.config = { darkMode: 'class', theme: { extend: { colors: { darkbg: '#0f172a', darkcard: '#1e293b' }, animation: { 'fade-in': 'fadeIn 0.5s ease-out' }, keyframes: { fadeIn: { '0%': { opacity: '0', transform: 'translateY(10px)' }, '100%': { opacity: '1', transform: 'translateY(0)' } } } } } } | |
| </script> | |
| <style> | |
| .gradient-text { | |
| background: linear-gradient(to right, #4F46E5, #06B6D4); | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| } | |
| html[dir="rtl"] #aboutPage { | |
| direction: rtl; | |
| text-align: right; | |
| } | |
| html[dir="rtl"] #aboutPage .resource-row, | |
| html[dir="rtl"] #aboutPage .section-row { | |
| flex-direction: row-reverse; | |
| } | |
| html[dir="rtl"] #aboutPage .citation-button-wrap { | |
| left: 0.75rem; | |
| right: auto; | |
| } | |
| html[dir="rtl"] #aboutPage #citationCode { | |
| direction: ltr; | |
| text-align: left; | |
| } | |
| </style> | |
| </head> | |
| <body class="bg-slate-50 text-slate-800 font-sans transition-colors duration-300 dark:bg-darkbg dark:text-slate-100"> | |
| <div id="aboutPage" class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 py-12"></div> | |
| <script> | |
| const ABOUT_PAGE_CONTENT = { | |
| en: ` | |
| <div class="text-center mb-12"> | |
| <h1 class="text-4xl font-extrabold tracking-tight sm:text-5xl gradient-text mb-6">About QIMMA</h1> | |
| </div> | |
| <div class="space-y-12 animate-fade-in"> | |
| <section class="bg-white dark:bg-slate-800 rounded-2xl p-8 shadow-sm border border-slate-200 dark:border-slate-700"> | |
| <div class="section-row flex items-center gap-3 mb-4"> | |
| <div class="p-2 bg-indigo-100 dark:bg-indigo-900/50 rounded-lg text-indigo-600 dark:text-indigo-400"> | |
| <i data-lucide="info" class="w-6 h-6"></i> | |
| </div> | |
| <h2 class="text-2xl font-bold text-slate-800 dark:text-slate-100">What is QIMMA?</h2> | |
| </div> | |
| <div class="prose dark:prose-invert max-w-none text-slate-600 dark:text-slate-300 leading-relaxed"> | |
| <p class="mb-4"> | |
| QIMMA قمّة (Summit in Arabic) is a quality-assured Arabic LLM evaluation leaderboard built on 14 carefully chosen benchmarks spanning STEM, legal reasoning, medical knowledge, poetry, cultural understanding, and code generation. QIMMA includes over 52,000 quality-validated samples across multiple-choice, generative, and code evaluation tracks. Over 99% of QIMMA's content is native Arabic, ensuring authentic linguistic and cultural assessment rather than relying on translated materials. | |
| </p> | |
| <p> | |
| QIMMA was constructed through a systematic benchmark curation process: candidate benchmarks were assessed using a multi-model quality validation pipeline that identified issues in the samples, including false, missing or invalid gold answers, textual encoding problems and many more. Only clean, validated samples made it into the final leaderboard. This process also revealed that quality problems are more pervasive across existing Arabic benchmarks than previously documented. | |
| </p> | |
| </div> | |
| </section> | |
| <section class="bg-white dark:bg-slate-800 rounded-2xl p-8 shadow-sm border border-slate-200 dark:border-slate-700"> | |
| <div class="section-row flex items-center gap-3 mb-4"> | |
| <div class="p-2 bg-emerald-100 dark:bg-emerald-900/50 rounded-lg text-emerald-600 dark:text-emerald-400"> | |
| <i data-lucide="cpu" class="w-6 h-6"></i> | |
| </div> | |
| <h2 class="text-2xl font-bold text-slate-800 dark:text-slate-100">How It Works</h2> | |
| </div> | |
| <div class="prose dark:prose-invert max-w-none text-slate-600 dark:text-slate-300 leading-relaxed"> | |
| <p class="mb-6"> | |
| QIMMA uses a multi-framework evaluation pipeline tailored to each task type. Multiple-choice and generative QA tasks are evaluated using <a href="https://github.com/huggingface/lighteval" target="_blank" class="text-indigo-600 dark:text-indigo-400 hover:underline">LightEval</a>, code generation is evaluated using <a href="https://github.com/evalplus/evalplus" target="_blank" class="text-indigo-600 dark:text-indigo-400 hover:underline">EvalPlus</a>, and poetry understanding is evaluated using an adapted version of the <a href="https://github.com/mbzuai-oryx/FannOrFlop" target="_blank" class="text-indigo-600 dark:text-indigo-400 hover:underline">FannOrFlop</a> evaluation framework. All models are run in a controlled environment with consistent prompt templates to ensure fair comparison. | |
| </p> | |
| <h3 class="text-lg font-bold text-slate-800 dark:text-slate-200 mb-3">Evaluation Pipeline</h3> | |
| <ul class="space-y-3 list-disc list-inside marker:text-indigo-500"> | |
| <li><strong>Submission:</strong> Users submit their Hugging Face model ID.</li> | |
| <li><strong>Queue:</strong> Models are added to a processing queue. You can track the status of your submission at any time on the <a href="https://huggingface.co/spaces/qimma/leaderboard" target="_blank" class="text-indigo-600 dark:text-indigo-400 hover:underline">submission page</a>.</li> | |
| <li><strong>Execution:</strong> Our GPU cluster loads the model and runs the benchmark suite across all tracks.</li> | |
| <li><strong>Scoring:</strong> Per-subset scores are aggregated by domain and published alongside per-sample model predictions for full transparency.</li> | |
| </ul> | |
| </div> | |
| </section> | |
| <section class="bg-white dark:bg-slate-800 rounded-2xl p-8 shadow-sm border border-slate-200 dark:border-slate-700"> | |
| <div class="section-row flex items-center gap-3 mb-4"> | |
| <div class="p-2 bg-orange-100 dark:bg-orange-900/50 rounded-lg text-orange-600 dark:text-orange-400"> | |
| <i data-lucide="layout-dashboard" class="w-6 h-6"></i> | |
| </div> | |
| <h2 class="text-2xl font-bold text-slate-800 dark:text-slate-100">Exploring the Leaderboard</h2> | |
| </div> | |
| <div class="mb-6"> | |
| <p class="text-xs font-bold uppercase tracking-widest text-slate-400 dark:text-slate-500 mb-3">Finding Models</p> | |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-4"> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center gap-2 mb-2"> | |
| <i data-lucide="search" class="w-4 h-4 text-indigo-500 dark:text-indigo-400 shrink-0"></i> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">Search</h4> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">Instantly find any model by typing the <strong class="font-semibold text-slate-700 dark:text-slate-300">name or organization</strong></p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center gap-2 mb-2"> | |
| <i data-lucide="sliders-horizontal" class="w-4 h-4 text-indigo-500 dark:text-indigo-400 shrink-0"></i> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">Model Filters</h4> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">Filter by <strong class="font-semibold text-slate-700 dark:text-slate-300">model type</strong>, <strong class="font-semibold text-slate-700 dark:text-slate-300">model size</strong>, <strong class="font-semibold text-slate-700 dark:text-slate-300">organization</strong>, and <strong class="font-semibold text-slate-700 dark:text-slate-300">license</strong> to narrow comparisons to exactly the model families you care about.</p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center gap-2 mb-2"> | |
| <i data-lucide="filter" class="w-4 h-4 text-indigo-500 dark:text-indigo-400 shrink-0"></i> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">Benchmark Filters</h4> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">Filter by <strong class="font-semibold text-slate-700 dark:text-slate-300">task type</strong> (MCQ, QA, Code) or <strong class="font-semibold text-slate-700 dark:text-slate-300">domain</strong> (STEM, Medical, Legal, Cultural, etc.) to focus on evaluation dimensions most relevant to your work.</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="mb-6"> | |
| <p class="text-xs font-bold uppercase tracking-widest text-slate-400 dark:text-slate-500 mb-3">Controlling the View</p> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-4"> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center gap-2 mb-2"> | |
| <i data-lucide="eye" class="w-4 h-4 text-emerald-500 dark:text-emerald-400 shrink-0"></i> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">Column Visibility</h4> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">Toggle individual <strong class="font-semibold text-slate-700 dark:text-slate-300">benchmark columns</strong> on or off to keep the table focused on the tasks relevant to your evaluation needs.</p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center gap-2 mb-2"> | |
| <i data-lucide="arrow-up-down" class="w-4 h-4 text-emerald-500 dark:text-emerald-400 shrink-0"></i> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">Sortable Columns</h4> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">Click any <strong class="font-semibold text-slate-700 dark:text-slate-300">column header</strong> to sort <strong class="font-semibold text-slate-700 dark:text-slate-300">ascending or descending</strong> to immediately see which models lead on any individual benchmark.</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="mb-6"> | |
| <p class="text-xs font-bold uppercase tracking-widest text-slate-400 dark:text-slate-500 mb-3">Analyzing Results</p> | |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-4"> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center gap-2 mb-2"> | |
| <i data-lucide="trophy" class="w-4 h-4 text-amber-500 dark:text-amber-400 shrink-0"></i> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">Ranking Mode</h4> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400"><strong class="font-semibold text-slate-700 dark:text-slate-300">Global Rank</strong> shows fixed positions across all benchmarks. <strong class="font-semibold text-slate-700 dark:text-slate-300">Current View Rank</strong> recalculates live based on your active filters and sort.</p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center gap-2 mb-2"> | |
| <i data-lucide="calculator" class="w-4 h-4 text-amber-500 dark:text-amber-400 shrink-0"></i> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">Filtered Average</h4> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">Switch the Avg column between <strong class="font-semibold text-slate-700 dark:text-slate-300">Global Average</strong> (all benchmarks) and <strong class="font-semibold text-slate-700 dark:text-slate-300">Filtered Average</strong> (only visible columns) to compare models on a custom subset.</p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center gap-2 mb-2"> | |
| <i data-lucide="panel-right-open" class="w-4 h-4 text-amber-500 dark:text-amber-400 shrink-0"></i> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">Model Detail View</h4> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">Click any model name to open a full breakdown: <strong class="font-semibold text-slate-700 dark:text-slate-300">per-benchmark scores</strong>, <strong class="font-semibold text-slate-700 dark:text-slate-300">model size</strong>, type, license, and a link to the <strong class="font-semibold text-slate-700 dark:text-slate-300">Hugging Face model card</strong>.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="bg-white dark:bg-slate-800 rounded-2xl p-8 shadow-sm border border-slate-200 dark:border-slate-700"> | |
| <div class="section-row flex items-center gap-3 mb-4"> | |
| <div class="p-2 bg-purple-100 dark:bg-purple-900/50 rounded-lg text-purple-600 dark:text-purple-400"> | |
| <i data-lucide="bar-chart-2" class="w-6 h-6"></i> | |
| </div> | |
| <h2 class="text-2xl font-bold text-slate-800 dark:text-slate-100">Benchmarks & Metrics</h2> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-6"> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center justify-between mb-2"> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">Cultural Understanding</h4> | |
| <span class="text-xs font-medium px-2 py-0.5 rounded-full bg-indigo-100 dark:bg-indigo-900/50 text-indigo-600 dark:text-indigo-400">MCQ</span> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">AraDiCE-Culture, ArabCulture, PalmX — evaluating native Arabic cultural knowledge, social norms, and regional understanding.</p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center justify-between mb-2"> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">STEM</h4> | |
| <span class="text-xs font-medium px-2 py-0.5 rounded-full bg-indigo-100 dark:bg-indigo-900/50 text-indigo-600 dark:text-indigo-400">MCQ</span> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">ArabicMMLU, 3LM STEM, GAT (Saudi General Aptitude Test) — covering science, mathematics, verbal reasoning, and technical aptitude across diverse academic subjects.</p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center justify-between mb-2"> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">Legal</h4> | |
| <div class="flex gap-1"> | |
| <span class="text-xs font-medium px-2 py-0.5 rounded-full bg-indigo-100 dark:bg-indigo-900/50 text-indigo-600 dark:text-indigo-400">MCQ</span> | |
| <span class="text-xs font-medium px-2 py-0.5 rounded-full bg-cyan-100 dark:bg-cyan-900/50 text-cyan-600 dark:text-cyan-400">QA</span> | |
| </div> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">ArabLegalQA (Saudi law), MizanQA (Moroccan law) — testing legal reasoning and regulatory understanding across Arabic jurisdictions.</p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center justify-between mb-2"> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">Medical</h4> | |
| <div class="flex gap-1"> | |
| <span class="text-xs font-medium px-2 py-0.5 rounded-full bg-indigo-100 dark:bg-indigo-900/50 text-indigo-600 dark:text-indigo-400">MCQ</span> | |
| <span class="text-xs font-medium px-2 py-0.5 rounded-full bg-cyan-100 dark:bg-cyan-900/50 text-cyan-600 dark:text-cyan-400">QA</span> | |
| </div> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">MedArabiQ, MedAraBench — evaluating healthcare knowledge, clinical reasoning, and medical terminology in Arabic.</p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center justify-between mb-2"> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">Poetry & Literature</h4> | |
| <span class="text-xs font-medium px-2 py-0.5 rounded-full bg-cyan-100 dark:bg-cyan-900/50 text-cyan-600 dark:text-cyan-400">QA</span> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">FannOrFlop — assessing understanding of classical and modern Arabic poetry, literary devices, and cultural context.</p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center justify-between mb-2"> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">Trust & Safety</h4> | |
| <span class="text-xs font-medium px-2 py-0.5 rounded-full bg-indigo-100 dark:bg-indigo-900/50 text-indigo-600 dark:text-indigo-400">MCQ</span> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">AraTrust — probing model behavior on sensitive content, bias, and safety-relevant scenarios in Arabic.</p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center justify-between mb-2"> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">Code Generation</h4> | |
| <span class="text-xs font-medium px-2 py-0.5 rounded-full bg-emerald-100 dark:bg-emerald-900/50 text-emerald-600 dark:text-emerald-400">CODE</span> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">3LM HumanEval+, 3LM MBPP+ — assessing code generation from Arabic instructions, evaluated via functional correctness (pass@1).</p> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="bg-white dark:bg-slate-800 rounded-2xl p-8 shadow-sm border border-slate-200 dark:border-slate-700"> | |
| <div class="section-row flex items-center gap-3 mb-6"> | |
| <div class="p-2 bg-cyan-100 dark:bg-cyan-900/50 rounded-lg text-cyan-600 dark:text-cyan-400"> | |
| <i data-lucide="link" class="w-6 h-6"></i> | |
| </div> | |
| <h2 class="text-2xl font-bold text-slate-800 dark:text-slate-100">Resources</h2> | |
| </div> | |
| <div class="grid grid-cols-1 sm:grid-cols-3 gap-4"> | |
| <a href="https://arxiv.org/pdf/2604.03395" target="_blank" class="flex flex-col gap-3 p-5 rounded-xl border border-slate-200 dark:border-slate-600 bg-slate-50 dark:bg-slate-700/30 hover:border-indigo-400 dark:hover:border-indigo-500 hover:shadow-md transition-all group"> | |
| <div class="resource-row flex items-center gap-2 text-slate-700 dark:text-slate-300 group-hover:text-indigo-600 dark:group-hover:text-indigo-400 transition-colors"> | |
| <i data-lucide="file-text" class="w-5 h-5 shrink-0"></i> | |
| <span class="font-semibold">Paper</span> | |
| </div> | |
| <p class="text-sm text-slate-500 dark:text-slate-400 leading-relaxed flex-1"> | |
| Describes the full methodology, benchmark design, and analysis behind QIMMA — including task selection, scoring, and model comparisons. | |
| </p> | |
| <span class="inline-flex items-center gap-1 text-xs text-indigo-500 dark:text-indigo-400 font-medium"> | |
| Read on arXiv <i data-lucide="arrow-right" class="w-3 h-3"></i> | |
| </span> | |
| </a> | |
| <a href="https://huggingface.co/blog/tiiuae/qimma-arabic-leaderboard" target="_blank" class="flex flex-col gap-3 p-5 rounded-xl border border-slate-200 dark:border-slate-600 bg-slate-50 dark:bg-slate-700/30 hover:border-indigo-400 dark:hover:border-indigo-500 hover:shadow-md transition-all group"> | |
| <div class="resource-row flex items-center gap-2 text-slate-700 dark:text-slate-300 group-hover:text-indigo-600 dark:group-hover:text-indigo-400 transition-colors"> | |
| <i data-lucide="newspaper" class="w-5 h-5 shrink-0"></i> | |
| <span class="font-semibold">Blog Post</span> | |
| </div> | |
| <p class="text-sm text-slate-500 dark:text-slate-400 leading-relaxed flex-1"> | |
| A high-level overview of QIMMA, its goals, the benchmarks it covers, and key findings from the evaluation of Arabic language models. | |
| </p> | |
| <span class="inline-flex items-center gap-1 text-xs text-indigo-500 dark:text-indigo-400 font-medium"> | |
| Read on Hugging Face <i data-lucide="arrow-right" class="w-3 h-3"></i> | |
| </span> | |
| </a> | |
| <a href="https://github.com/tiiuae/QIMMA-leaderboard" target="_blank" class="flex flex-col gap-3 p-5 rounded-xl border border-slate-200 dark:border-slate-600 bg-slate-50 dark:bg-slate-700/30 hover:border-indigo-400 dark:hover:border-indigo-500 hover:shadow-md transition-all group"> | |
| <div class="resource-row flex items-center gap-2 text-slate-700 dark:text-slate-300 group-hover:text-indigo-600 dark:group-hover:text-indigo-400 transition-colors"> | |
| <svg class="w-6 h-6 shrink-0" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"/></svg> | |
| <span class="font-semibold">GitHub Repository</span> | |
| </div> | |
| <p class="text-sm text-slate-500 dark:text-slate-400 leading-relaxed flex-1"> | |
| Contains the full evaluation pipeline used to produce every score on this leaderboard. Use it to reproduce results, run evaluations on your own models, or extend the benchmark suite. | |
| </p> | |
| <span class="inline-flex items-center gap-1 text-xs text-indigo-500 dark:text-indigo-400 font-medium"> | |
| View on GitHub <i data-lucide="arrow-right" class="w-3 h-3"></i> | |
| </span> | |
| </a> | |
| </div> | |
| <p class="mt-5 text-sm text-slate-600 dark:text-slate-400"> | |
| To contact us about the leaderboard, open a discussion <a href="https://huggingface.co/spaces/qimma/leaderboard/discussions" target="_blank" class="text-indigo-600 dark:text-indigo-400 hover:underline">here</a>. | |
| </p> | |
| </section> | |
| <section class="bg-white dark:bg-slate-800 rounded-2xl p-8 shadow-sm border border-slate-200 dark:border-slate-700"> | |
| <div class="section-row flex items-center gap-3 mb-4"> | |
| <div class="p-2 bg-amber-100 dark:bg-amber-900/50 rounded-lg text-amber-600 dark:text-amber-400"> | |
| <i data-lucide="sparkles" class="w-6 h-6"></i> | |
| </div> | |
| <h2 class="text-2xl font-bold text-slate-800 dark:text-slate-100">Acknowledgements</h2> | |
| </div> | |
| <p class="text-slate-600 dark:text-slate-300 leading-relaxed"> | |
| QIMMA is sponsored by the <a href="https://www.tii.ae" target="_blank" class="text-indigo-600 dark:text-indigo-400 hover:underline font-medium">Technology Innovation Institute (TII)</a>, which provides the compute resources and institutional support that make this leaderboard possible. | |
| </p> | |
| </section> | |
| </div> | |
| <div class="mt-12 border-t border-slate-200 dark:border-slate-700 pt-8 pb-8"> | |
| <h3 class="text-xl font-bold text-center text-slate-800 dark:text-slate-100 mb-6">Citation</h3> | |
| <div class="max-w-4xl mx-auto relative group"> | |
| <div class="citation-button-wrap absolute top-3 right-3"> | |
| <button onclick="copyCitation()" class="p-2 rounded-lg bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-600 text-slate-500 hover:text-indigo-600 dark:text-slate-400 dark:hover:text-indigo-400 shadow-sm transition-all" title="Copy to clipboard"> | |
| <i id="copyIcon" data-lucide="copy" class="w-4 h-4"></i> | |
| </button> | |
| </div> | |
| <pre id="citationCode" class="bg-slate-100 dark:bg-slate-900/50 p-6 rounded-xl border border-slate-200 dark:border-slate-700 overflow-x-auto text-xs sm:text-sm text-slate-600 dark:text-slate-400 font-mono leading-relaxed">@misc{alqadi2026arabicbenchmarksreliableqimmas, | |
| title={Are Arabic Benchmarks Reliable? QIMMA's Quality-First Approach to LLM Evaluation}, | |
| author={Leen AlQadi and Ahmed Alzubaidi and Mohammed Alyafeai and Hamza Alobeidli and Maitha Alhammadi and Shaikha Alsuwaidi and Omar Alkaabi and Basma El Amel Boussaha and Hakim Hacid}, | |
| year={2026}, | |
| eprint={2604.03395}, | |
| archivePrefix={arXiv}, | |
| primaryClass={cs.CL}, | |
| url={https://arxiv.org/abs/2604.03395}, | |
| }</pre> | |
| </div> | |
| </div> | |
| `, | |
| ar: ` | |
| <div class="text-center mb-12"> | |
| <h1 class="text-4xl font-extrabold tracking-tight sm:text-5xl gradient-text mb-6">حول QIMMA</h1> | |
| </div> | |
| <div class="space-y-12 animate-fade-in"> | |
| <section class="bg-white dark:bg-slate-800 rounded-2xl p-8 shadow-sm border border-slate-200 dark:border-slate-700"> | |
| <div class="section-row flex items-center gap-3 mb-4"> | |
| <div class="p-2 bg-indigo-100 dark:bg-indigo-900/50 rounded-lg text-indigo-600 dark:text-indigo-400"> | |
| <i data-lucide="info" class="w-6 h-6"></i> | |
| </div> | |
| <h2 class="text-2xl font-bold text-slate-800 dark:text-slate-100">ما هي QIMMA؟</h2> | |
| </div> | |
| <div class="prose dark:prose-invert max-w-none text-slate-600 dark:text-slate-300 leading-relaxed"> | |
| <p class="mb-4"> | |
| QIMMA قمّة هي لوحة صدارة عربية مضمونة الجودة لتقييم النماذج اللغوية، مبنية على 14 معيارًا تقييمياً تم اختيارها بعناية، وتغطي مجالات العلوم والتقنية والهندسة والرياضيات، والاستدلال القانوني، والمعرفة الطبية، والشعر، والفهم الثقافي، والبرمجة. تضم QIMMA أكثر من 52,000 عينة تم تحقق من جودتها وتضم الاختيار من متعدد، والإجابة التوليدية، وتقييم البرمجي. وأكثر من 99% من محتوى QIMMA عربيُّ الأصل، مما يضمن تقييمًا لغويًا وثقافيًا أصيلًا بدلًا من الاعتماد على مواد مترجمة. | |
| </p> | |
| <p> | |
| بنية QIMMA عبر عملية منهجية، حيث خضعت المعايير المرشحة لمسار تحقق من الجودة يعتمد على عدة نماذج، وكشف عن مشكلات في العينات، منها الإجابات المرجعية الخاطئة أو الناقصة أو غير الصالحة، ومشكلات ترميز النص، وغيرها الكثير. لم تصل إلى لوحة الصدارة النهائية إلا العينات النظيفة والمتحقق منها. كما كشفت هذه العملية أن مشكلات الجودة أكثر انتشارًا في المعايير العربية الحالية مما كان موثقًا سابقًا. | |
| </p> | |
| </div> | |
| </section> | |
| <section class="bg-white dark:bg-slate-800 rounded-2xl p-8 shadow-sm border border-slate-200 dark:border-slate-700"> | |
| <div class="section-row flex items-center gap-3 mb-4"> | |
| <div class="p-2 bg-emerald-100 dark:bg-emerald-900/50 rounded-lg text-emerald-600 dark:text-emerald-400"> | |
| <i data-lucide="cpu" class="w-6 h-6"></i> | |
| </div> | |
| <h2 class="text-2xl font-bold text-slate-800 dark:text-slate-100">كيف تعمل المنصة</h2> | |
| </div> | |
| <div class="prose dark:prose-invert max-w-none text-slate-600 dark:text-slate-300 leading-relaxed"> | |
| <p class="mb-6"> | |
| تستخدم QIMMA مسار تقييم متعدد إطارات ومصممًا بما يلائم كل نوع من المهام. يتم تقييم أسئلة الاختيار من متعدد ومهام الإجابة التوليدية باستخدام <a href="https://github.com/huggingface/lighteval" target="_blank" class="text-indigo-600 dark:text-indigo-400 hover:underline">LightEval</a>، وتقيم المهام البرمجة بإستخدام <a href="https://github.com/evalplus/evalplus" target="_blank" class="text-indigo-600 dark:text-indigo-400 hover:underline">EvalPlus</a>، بينما يُقيَّم فهم الشعر باستخدام نسخة معدله من إطار التقييم <a href="https://github.com/mbzuai-oryx/FannOrFlop" target="_blank" class="text-indigo-600 dark:text-indigo-400 hover:underline">FannOrFlop</a>. ويتم تشغيل جميع النماذج ضمن بيئة مضبوطة مع قوالب توجيه ثابته لضمان مقارنة عادلة. | |
| </p> | |
| <h3 class="text-lg font-bold text-slate-800 dark:text-slate-200 mb-3">مسار التقيم</h3> | |
| <ul class="space-y-3 list-disc list-inside marker:text-indigo-500"> | |
| <li><strong>الإرسال:</strong> يرسل المستخدمون اسم النموذج الخاص بهم على Hugging Face.</li> | |
| <li><strong>الانتظار:</strong> تُضاف النماذج إلى قائمة معالجة. ويمكنك تتبع حالة الإرسال في أي وقت عبر <a href="https://huggingface.co/spaces/qimma/leaderboard" target="_blank" class="text-indigo-600 dark:text-indigo-400 hover:underline">صفحة الإرسال</a>.</li> | |
| <li><strong>التنفيذ:</strong> تقوم الحواسيب ال GPU لدينا بتحميل النموذج وتشغيل مجموعة المعايير التقييمية عبر جميع المسارات.</li> | |
| <li><strong>التقيم:</strong> تُجمع الدرجات على مستوى الأجزاء الفرعية بحسب المجال، وتُنشر إلى جانب تنبؤات النموذج لكل عينة لضمان الشفافية الكاملة.</li> | |
| </ul> | |
| </div> | |
| </section> | |
| <section class="bg-white dark:bg-slate-800 rounded-2xl p-8 shadow-sm border border-slate-200 dark:border-slate-700"> | |
| <div class="section-row flex items-center gap-3 mb-4"> | |
| <div class="p-2 bg-orange-100 dark:bg-orange-900/50 rounded-lg text-orange-600 dark:text-orange-400"> | |
| <i data-lucide="layout-dashboard" class="w-6 h-6"></i> | |
| </div> | |
| <h2 class="text-2xl font-bold text-slate-800 dark:text-slate-100">استكشاف لوحة الصدارة</h2> | |
| </div> | |
| <div class="mb-6"> | |
| <p class="text-xs font-bold uppercase tracking-widest text-slate-400 dark:text-slate-500 mb-3">العثور على النماذج</p> | |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-4"> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center gap-2 mb-2"> | |
| <i data-lucide="search" class="w-4 h-4 text-indigo-500 dark:text-indigo-400 shrink-0"></i> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">البحث</h4> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">اعثر فورًا على أي نموذج بكتابة <strong class="font-semibold text-slate-700 dark:text-slate-300">اسمه أو الجهة المطوّرة له</strong>.</p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center gap-2 mb-2"> | |
| <i data-lucide="sliders-horizontal" class="w-4 h-4 text-indigo-500 dark:text-indigo-400 shrink-0"></i> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">فلاتر النموذج</h4> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">فلتر بحسب <strong class="font-semibold text-slate-700 dark:text-slate-300">نوع النموذج</strong>، و<strong class="font-semibold text-slate-700 dark:text-slate-300">حجم النموذج</strong>، و<strong class="font-semibold text-slate-700 dark:text-slate-300">الجهة المطوّرة</strong>، و<strong class="font-semibold text-slate-700 dark:text-slate-300">الترخيص</strong> للمقارنة بين النماذج التي تهمك.</p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center gap-2 mb-2"> | |
| <i data-lucide="filter" class="w-4 h-4 text-indigo-500 dark:text-indigo-400 shrink-0"></i> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">فلاتر المعايير</h4> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">فلتر بحسب <strong class="font-semibold text-slate-700 dark:text-slate-300">نوع المهمة</strong> (اختيار من متعدد، سؤال وجواب، برمجة) أو <strong class="font-semibold text-slate-700 dark:text-slate-300">المجال</strong> (STEM، الطب، القانون، الثقافة، وغيرها) للتركيز على أبعاد التقييم الأكثر صلة بعملك.</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="mb-6"> | |
| <p class="text-xs font-bold uppercase tracking-widest text-slate-400 dark:text-slate-500 mb-3">التحكم في العرض</p> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-4"> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center gap-2 mb-2"> | |
| <i data-lucide="eye" class="w-4 h-4 text-emerald-500 dark:text-emerald-400 shrink-0"></i> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">إظهار الأعمدة</h4> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">أوقف أو شغل أيا من <strong class="font-semibold text-slate-700 dark:text-slate-300">أعمدة المعايير</strong> لإبقاء الجدول مركزًا على المهام ذات الصلة باحتياجاتك التقييمية.</p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center gap-2 mb-2"> | |
| <i data-lucide="arrow-up-down" class="w-4 h-4 text-emerald-500 dark:text-emerald-400 shrink-0"></i> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">أعمدة قابلة للترتيب</h4> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">انقر على أي <strong class="font-semibold text-slate-700 dark:text-slate-300">رأس عمود</strong> لترتيب <strong class="font-semibold text-slate-700 dark:text-slate-300">تصاعديًا أو تنازليًا</strong> لرؤية النماذج المتقدمة فورًا في أي من المعيار التقييمية.</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="mb-6"> | |
| <p class="text-xs font-bold uppercase tracking-widest text-slate-400 dark:text-slate-500 mb-3">تحليل النتائج</p> | |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-4"> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center gap-2 mb-2"> | |
| <i data-lucide="trophy" class="w-4 h-4 text-amber-500 dark:text-amber-400 shrink-0"></i> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">وضع الترتيب</h4> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400"><strong class="font-semibold text-slate-700 dark:text-slate-300">الترتيب العام</strong> يعرض ترتيب ثابت عبر جميع المعايير. أما <strong class="font-semibold text-slate-700 dark:text-slate-300">ترتيب العرض الحالي</strong> فيُعاد حسابه مباشرة بناءً على الفلترات والترتيب النشطين.</p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center gap-2 mb-2"> | |
| <i data-lucide="calculator" class="w-4 h-4 text-amber-500 dark:text-amber-400 shrink-0"></i> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">فلترت المتوسط الحسابي</h4> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">بدّل عمود المتوسط بين <strong class="font-semibold text-slate-700 dark:text-slate-300">المتوسط العام</strong> (جميع المعايير) و<strong class="font-semibold text-slate-700 dark:text-slate-300">فلتر المتوسط الحسابي | |
| </strong> (الأعمدة الظاهرة فقط) لمقارنة النماذج على مجموعة فرعية مخصّصة.</p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center gap-2 mb-2"> | |
| <i data-lucide="panel-right-open" class="w-4 h-4 text-amber-500 dark:text-amber-400 shrink-0"></i> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">عرض تفاصيل النموذج</h4> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">انقر على اسم أي نموذج لفتح تفصيل كامل: <strong class="font-semibold text-slate-700 dark:text-slate-300">درجات كل معيار</strong>، و<strong class="font-semibold text-slate-700 dark:text-slate-300">حجم النموذج</strong>، ونوعه، وترخيصه، ورابط إلى <strong class="font-semibold text-slate-700 dark:text-slate-300">صفحة النموذج على Hugging Face</strong>.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="bg-white dark:bg-slate-800 rounded-2xl p-8 shadow-sm border border-slate-200 dark:border-slate-700"> | |
| <div class="section-row flex items-center gap-3 mb-4"> | |
| <div class="p-2 bg-purple-100 dark:bg-purple-900/50 rounded-lg text-purple-600 dark:text-purple-400"> | |
| <i data-lucide="bar-chart-2" class="w-6 h-6"></i> | |
| </div> | |
| <h2 class="text-2xl font-bold text-slate-800 dark:text-slate-100">المعايير والمقاييس</h2> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-6"> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center justify-between mb-2"> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">الفهم الثقافي</h4> | |
| <span class="text-xs font-medium px-2 py-0.5 rounded-full bg-indigo-100 dark:bg-indigo-900/50 text-indigo-600 dark:text-indigo-400">MCQ</span> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">AraDiCE-Culture وArabCulture وPalmX — لتقييم المعرفة الثقافية العربية الأصيلة، والأعراف الاجتماعية، والفهم الإقليمي.</p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center justify-between mb-2"> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">STEM</h4> | |
| <span class="text-xs font-medium px-2 py-0.5 rounded-full bg-indigo-100 dark:bg-indigo-900/50 text-indigo-600 dark:text-indigo-400">MCQ</span> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">ArabicMMLU و3LM STEM وGAT (اختبار القدرات العامة السعودي) — لتغطية العلوم، والرياضيات، والاستدلال اللفظي، والقدرة التقنية عبر موضوعات أكاديمية متنوعة.</p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center justify-between mb-2"> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">القانون</h4> | |
| <div class="flex gap-1"> | |
| <span class="text-xs font-medium px-2 py-0.5 rounded-full bg-indigo-100 dark:bg-indigo-900/50 text-indigo-600 dark:text-indigo-400">MCQ</span> | |
| <span class="text-xs font-medium px-2 py-0.5 rounded-full bg-cyan-100 dark:bg-cyan-900/50 text-cyan-600 dark:text-cyan-400">QA</span> | |
| </div> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">ArabLegalQA (القانون السعودي) وMizanQA (القانون المغربي) — لاختبار الاستدلال القانوني وفهم الأنظمة عبر ولايات قضائية عربية.</p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center justify-between mb-2"> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">الطب</h4> | |
| <div class="flex gap-1"> | |
| <span class="text-xs font-medium px-2 py-0.5 rounded-full bg-indigo-100 dark:bg-indigo-900/50 text-indigo-600 dark:text-indigo-400">MCQ</span> | |
| <span class="text-xs font-medium px-2 py-0.5 rounded-full bg-cyan-100 dark:bg-cyan-900/50 text-cyan-600 dark:text-cyan-400">QA</span> | |
| </div> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">MedArabiQ وMedAraBench — لتقييم المعرفة الصحية، والاستدلال السريري، والمصطلحات الطبية باللغة العربية.</p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center justify-between mb-2"> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">الشعر والأدب</h4> | |
| <span class="text-xs font-medium px-2 py-0.5 rounded-full bg-cyan-100 dark:bg-cyan-900/50 text-cyan-600 dark:text-cyan-400">QA</span> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">FannOrFlop — لتقييم فهم الشعر العربي القديم والحديث، والأساليب البلاغية، والسياق الثقافي.</p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center justify-between mb-2"> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">الثقة والسلامة</h4> | |
| <span class="text-xs font-medium px-2 py-0.5 rounded-full bg-indigo-100 dark:bg-indigo-900/50 text-indigo-600 dark:text-indigo-400">MCQ</span> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">AraTrust — لاستكشاف سلوك النموذج في المحتوى الحساس، والانحياز، والسيناريوهات المرتبطة بالسلامة باللغة العربية.</p> | |
| </div> | |
| <div class="p-4 bg-slate-50 dark:bg-slate-700/30 rounded-xl border border-slate-100 dark:border-slate-700"> | |
| <div class="flex items-center justify-between mb-2"> | |
| <h4 class="font-bold text-slate-800 dark:text-slate-200">توليد البرمجة</h4> | |
| <span class="text-xs font-medium px-2 py-0.5 rounded-full bg-emerald-100 dark:bg-emerald-900/50 text-emerald-600 dark:text-emerald-400">CODE</span> | |
| </div> | |
| <p class="text-sm text-slate-600 dark:text-slate-400">3LM HumanEval+ و3LM MBPP+ — لتقييم توليد البرمجة من تعليمات عربية، ويجري تقييمها عبر الصحة الوظيفية (pass@1).</p> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="bg-white dark:bg-slate-800 rounded-2xl p-8 shadow-sm border border-slate-200 dark:border-slate-700"> | |
| <div class="section-row flex items-center gap-3 mb-6"> | |
| <div class="p-2 bg-cyan-100 dark:bg-cyan-900/50 rounded-lg text-cyan-600 dark:text-cyan-400"> | |
| <i data-lucide="link" class="w-6 h-6"></i> | |
| </div> | |
| <h2 class="text-2xl font-bold text-slate-800 dark:text-slate-100">المصادر</h2> | |
| </div> | |
| <div class="grid grid-cols-1 sm:grid-cols-3 gap-4"> | |
| <a href="https://arxiv.org/pdf/2604.03395" target="_blank" class="flex flex-col gap-3 p-5 rounded-xl border border-slate-200 dark:border-slate-600 bg-slate-50 dark:bg-slate-700/30 hover:border-indigo-400 dark:hover:border-indigo-500 hover:shadow-md transition-all group"> | |
| <div class="resource-row flex items-center gap-2 text-slate-700 dark:text-slate-300 group-hover:text-indigo-600 dark:group-hover:text-indigo-400 transition-colors"> | |
| <i data-lucide="file-text" class="w-5 h-5 shrink-0"></i> | |
| <span class="font-semibold">الورقة البحثية</span> | |
| </div> | |
| <p class="text-sm text-slate-500 dark:text-slate-400 leading-relaxed flex-1"> | |
| تصف المنهجية الكاملة، وتصميم المعايير، والتحليل الكامن وراء QIMMA، بما في ذلك اختيار المهام، واحتساب الدرجات، ومقارنات النماذج. | |
| </p> | |
| <span class="inline-flex items-center gap-1 text-xs text-indigo-500 dark:text-indigo-400 font-medium"> | |
| اقرأ على arXiv <i data-lucide="arrow-left" class="w-3 h-3"></i> | |
| </span> | |
| </a> | |
| <a href="https://huggingface.co/blog/tiiuae/qimma-arabic-leaderboard" target="_blank" class="flex flex-col gap-3 p-5 rounded-xl border border-slate-200 dark:border-slate-600 bg-slate-50 dark:bg-slate-700/30 hover:border-indigo-400 dark:hover:border-indigo-500 hover:shadow-md transition-all group"> | |
| <div class="resource-row flex items-center gap-2 text-slate-700 dark:text-slate-300 group-hover:text-indigo-600 dark:group-hover:text-indigo-400 transition-colors"> | |
| <i data-lucide="newspaper" class="w-5 h-5 shrink-0"></i> | |
| <span class="font-semibold">المقال التعريفي</span> | |
| </div> | |
| <p class="text-sm text-slate-500 dark:text-slate-400 leading-relaxed flex-1"> | |
| مقدمة موجزة إلى QIMMA، ودوافعها، والمجالات المعيارية التي تغطيها. | |
| </p> | |
| <span class="inline-flex items-center gap-1 text-xs text-indigo-500 dark:text-indigo-400 font-medium"> | |
| اقرأ على Hugging Face <i data-lucide="arrow-left" class="w-3 h-3"></i> | |
| </span> | |
| </a> | |
| <a href="https://github.com/tiiuae/QIMMA-leaderboard" target="_blank" class="flex flex-col gap-3 p-5 rounded-xl border border-slate-200 dark:border-slate-600 bg-slate-50 dark:bg-slate-700/30 hover:border-indigo-400 dark:hover:border-indigo-500 hover:shadow-md transition-all group"> | |
| <div class="resource-row flex items-center gap-2 text-slate-700 dark:text-slate-300 group-hover:text-indigo-600 dark:group-hover:text-indigo-400 transition-colors"> | |
| <svg class="w-6 h-6 shrink-0" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"/></svg> | |
| <span class="font-semibold">مشروع GitHub</span> | |
| </div> | |
| <p class="text-sm text-slate-500 dark:text-slate-400 leading-relaxed flex-1"> | |
| التنفيذ المفتوح المصدر للوحة الصدارة، ومسار التقييم، وواجهة الويب. | |
| </p> | |
| <span class="inline-flex items-center gap-1 text-xs text-indigo-500 dark:text-indigo-400 font-medium"> | |
| افتح GitHub <i data-lucide="arrow-left" class="w-3 h-3"></i> | |
| </span> | |
| </a> | |
| </div> | |
| <p class="mt-5 text-sm text-slate-600 dark:text-slate-400"> | |
| لمشاركة الملاحظات، أو طلب إضافة معايير، أو الإبلاغ عن مشكلة، يُرجى فتح <a href="https://huggingface.co/spaces/qimma/leaderboard/discussions" target="_blank" class="text-indigo-600 dark:text-indigo-400 hover:underline">نقاش هنا</a>. | |
| </p> | |
| </section> | |
| <section class="bg-white dark:bg-slate-800 rounded-2xl p-8 shadow-sm border border-slate-200 dark:border-slate-700"> | |
| <div class="section-row flex items-center gap-3 mb-4"> | |
| <div class="p-2 bg-amber-100 dark:bg-amber-900/50 rounded-lg text-amber-600 dark:text-amber-400"> | |
| <i data-lucide="sparkles" class="w-6 h-6"></i> | |
| </div> | |
| <h2 class="text-2xl font-bold text-slate-800 dark:text-slate-100">شكر وتقدير</h2> | |
| </div> | |
| <p class="text-slate-600 dark:text-slate-300 leading-relaxed">يتم دعم QIMMA من <a href="https://www.tii.ae" target="_blank" class="text-indigo-600 dark:text-indigo-400 hover:underline font-medium">معهد الابتكار التكنولوجي (TII)</a>، من خلال بنيته التحتية ودعمه المؤسسي. | |
| </p> | |
| </section> | |
| </div> | |
| <div class="mt-12 border-t border-slate-200 dark:border-slate-700 pt-8 pb-8"> | |
| <h3 class="text-xl font-bold text-center text-slate-800 dark:text-slate-100 mb-6">الاستشهاد</h3> | |
| <div class="max-w-4xl mx-auto relative group"> | |
| <div class="citation-button-wrap absolute top-3 right-3"> | |
| <button onclick="copyCitation()" class="p-2 rounded-lg bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-600 text-slate-500 hover:text-indigo-600 dark:text-slate-400 dark:hover:text-indigo-400 shadow-sm transition-all" title="نسخ إلى الحافظة"> | |
| <i id="copyIcon" data-lucide="copy" class="w-4 h-4"></i> | |
| </button> | |
| </div> | |
| <pre id="citationCode" class="bg-slate-100 dark:bg-slate-900/50 p-6 rounded-xl border border-slate-200 dark:border-slate-700 overflow-x-auto text-xs sm:text-sm text-slate-600 dark:text-slate-400 font-mono leading-relaxed">@misc{alqadi2026arabicbenchmarksreliableqimmas, | |
| title={Are Arabic Benchmarks Reliable? QIMMA's Quality-First Approach to LLM Evaluation}, | |
| author={Leen AlQadi and Ahmed Alzubaidi and Mohammed Alyafeai and Hamza Alobeidli and Maitha Alhammadi and Shaikha Alsuwaidi and Omar Alkaabi and Basma El Amel Boussaha and Hakim Hacid}, | |
| year={2026}, | |
| eprint={2604.03395}, | |
| archivePrefix={arXiv}, | |
| primaryClass={cs.CL}, | |
| url={https://arxiv.org/abs/2604.03395}, | |
| }</pre> | |
| </div> | |
| </div> | |
| ` | |
| }; | |
| function applyAboutTranslations(lang) { | |
| const page = document.getElementById('aboutPage'); | |
| if (!page) return; | |
| page.innerHTML = ABOUT_PAGE_CONTENT[lang] || ABOUT_PAGE_CONTENT.en; | |
| document.title = lang === 'ar' ? 'حول QIMMA' : 'About QIMMA'; | |
| if (window.lucide) lucide.createIcons(); | |
| } | |
| function copyCitation() { | |
| const text = document.getElementById('citationCode')?.innerText; | |
| if (!text) return; | |
| navigator.clipboard.writeText(text).then(() => { | |
| const icon = document.getElementById('copyIcon'); | |
| if (!icon) return; | |
| icon.setAttribute('data-lucide', 'check'); | |
| icon.classList.add('text-emerald-500'); | |
| if (window.lucide) lucide.createIcons(); | |
| setTimeout(() => { | |
| icon.setAttribute('data-lucide', 'copy'); | |
| icon.classList.remove('text-emerald-500'); | |
| if (window.lucide) lucide.createIcons(); | |
| }, 2000); | |
| }); | |
| } | |
| applyAboutTranslations(window.getCurrentLanguage ? window.getCurrentLanguage() : 'en'); | |
| if (window.registerLanguageListener) { | |
| window.registerLanguageListener(applyAboutTranslations); | |
| } | |
| </script> | |
| </body> | |
| </html> | |