コントラストチェッカー

背景色と文字色のコントラスト比を計算し、Webアクセシビリティ基準（WCAG AA/AAA）を満たしているか即座に判定。

3 free tries left for this tool todayStart free 3-day trial →

Colors

Text Color

Background Color

Contrast Ratio

17.74:1

The quick brown fox

Normal size body text preview — jumps over the lazy dog.

WCAG 2.1 Compliance

AA — Normal text (4.5:1)

AA — Large text (3:1)

AAA — Normal text (7:1)

AAA — Large text (4.5:1)

コントラストチェッカー

あらゆるユーザーにとって見やすく読みやすいWebサイトやUIデザインを作るための必須ツールです。

🔐 100% Private — Client-Side Execution

All processing happens inside your browser using WebAssembly and HTML5 Canvas. Zero file uploads, zero server tracking. Compliant with LGPD & GDPR.

よくある質問 (FAQ)

What is the difference between AA and AAA?

AA is the standard legal accessibility requirement most sites target. AAA is a stricter, optional level for maximum accessibility, harder to meet with brand colors.

What counts as "large text" for the 3:1 threshold?

Text that is at least 18pt (24px), or 14pt (18.66px) bold, per the WCAG 2.1 definition.

Does this check colorblind-safe contrast too?

This tool checks luminance contrast per WCAG, which helps broadly, but for color-vision-deficiency specifically, use the separate Color Blindness Simulator tool.

🔥 Speed Up Your Site - 60% Off Launch

Score 99+ on Google PageSpeed Insights

Fast-track Largest Contentful Paint (LCP) under 2.5s and learn secure browser WebAssembly sizing matrices. Get our premium ebook Pixel Perfect with 4 bonus guides.

📕 Get eBook Guide ($9) →

コントラストチェッカー

Colors

WCAG 2.1 Compliance

コントラストチェッカー

よくある質問 (FAQ)

Score 99+ on Google PageSpeed Insights

関連ツール