حاسبة CSS clamp() للخطوط المتجاوبة

عن الأداة

⁦clamp(الأدنى، المفضّل، الأقصى)⁩ يختار القيمة المفضّلة ما دامت بين الحدين. نجعل المفضّلة معادلة خطية بعرض الشاشة: الميل = (الحجم الأكبر − الأصغر) ÷ (العرض الأكبر − الأصغر)، والثابت = الحجم الأصغر − الميل × العرض الأصغر. ثم يُكتب الميل بوحدة vw (مضروبًا في 100) والثابت بالـ rem.

مثلًا من 18px عند 360px إلى 32px عند 1280px: الميل 14 ÷ 920 = 0.0152، أي 1.52vw، والثابت 18 − 0.0152 × 360 = 12.52px أي 0.7826rem. قبل 360px يثبت الحجم على 18، وبعد 1280px يثبت على 32.

كتابة الثابت بالـ rem لا بالـ px تجعل الحجم يستجيب لإعداد حجم الخط في المتصفح. أما جزء vw فلا يكبر مع تكبير الصفحة، ولذلك تنبهك الأداة إذا تباعد الحدان كثيرًا فقد لا يصل النص إلى ضعف حجمه عند التكبير كما تشترط WCAG.