wcag-audit-perceivable-text-size（WCAG 审核 perceivable text size）

When to Use

Use this tool when converting font sizes between units, checking accessibility compliance, or ensuring consistent typography scaling across different contexts.

Usage

Command Line

node scripts/convert.js --from 16px --to rem
node scripts/convert.js --value 1.25rem --base-font 16px --to px
node scripts/convert.js --from 14pt --to px --accessibility-check

JSON Input

node scripts/convert.js --json '{"from": "16px", "to": "rem", "baseFontSize": "16px"}'

Parameters

• --from: Source font size with unit (e.g., "16px", "12pt", "1.5em")
• --to: Target unit (px, pt, em, rem)
• --value: Alternative to --from for specifying the value
• --base-font: Base font size for em/rem calculations (default: 16px)
• --accessibility-check: Include WCAG compliance assessment
• --json: JSON input with conversion parameters

Output

Returns JSON with conversion results and accessibility assessment:

{
  "input": "16px",
  "output": "1rem",
  "baseFontSize": "16px",
  "accessibility": {
    "meetsMinimum": true,
    "recommendations": []
  }
}

Examples

Basic conversion

$ node scripts/convert.js --from 16px --to rem
16px = 1rem (base font: 16px)
✅ Accessibility: PASS (16px meets 14px minimum)

Point to pixel conversion

$ node scripts/convert.js --from 12pt --to px
12pt = 16px (1pt ≈ 1.333px)
✅ Accessibility: PASS (16px meets 14px minimum)

EM calculation with custom base

$ node scripts/convert.js --value 1.5em --base-font 18px --to px
1.5em = 27px (base font: 18px)
✅ Accessibility: PASS (27px exceeds 14px minimum)

Accessibility check

$ node scripts/convert.js --from 12px --to pt --accessibility-check
12px = 9pt
❌ Accessibility: FAIL (12px below 14px minimum for body text)
Recommendation: Increase to at least 14px (≈10.5pt) for readable text

Unit Conversions

Absolute Units

• px (pixels): Screen pixels, most common for web
• pt (points): Print units, 1pt = 1/72 inch

Relative Units

• em: Relative to parent element's font size
• rem: Relative to root element's font size (usually 16px)

Conversion Formulas

• 1pt ≈ 1.333px (at 96 DPI)
• 1em = 1 × parent font size
• 1rem = 1 × root font size (default: 16px)

WCAG Standards

• Minimum Size: 14px for body text, 18px for headings
• Zoom Support: Text must resize up to 200% without loss of functionality
• Relative Units: Prefer rem/em for better accessibility and responsiveness
• Print Compatibility: Consider pt units for print stylesheets

Best Practices

1. Use relative units: rem/em scale better with user preferences
2. Set root font size: Use 16px as base for consistent calculations
3. Test zoom: Ensure text remains readable when zoomed to 200%
4. Consider context: Different minimum sizes for different content types
5. Avoid fixed sizes: Allow user font size preferences to take effect

Learn More

For more information about Agent Skills and how they extend AI capabilities.