Chrome의 Devtools "CSS Oveview"에서 릴리스 페이지의 10가지 색상 조합에 대해 대비 문제를 지적했으며, 이 중 6가지가 심각합니다(비율이 WCAG AA 최소 기준에도 미달). 해당 항목은 다음과 같습니다.
- 앞서 언급한 “Highlights” 카드의
--color-feature배경 위에 흰색 텍스트 - “← Back to versions” 링크, 검은색 배경 위에 중간 파란색 텍스트, 대비 비율 3.9:1
- 보안 수정 카드의 “show” 확장 토글, 빨간색 배경 위에 80% 투명도의 작은 흰색 텍스트, 대비 비율 4.01:1. (나머지 보안 수정 텍스트는 반투명이 아니므로 5.43:1로 통과합니다.)
- “DEV” 배지, 회색빛 녹색 배경색
#7f8c8d위에 흰색 텍스트, 대비 비율 3.47:1 - 모든 커밋 날짜 및 기타
--text-muted(#888)가--bg-card(#2d2d2d) 위에 있는 경우, 대비 비율 3.08:1 - “Security” 배지,
#d36500(기본적으로 주황색) 위에 흰색 텍스트, 대비 비율 4.16:1.
아, 그리고 더 아래로 스크롤했다면 “Translations” 배지도 해당됩니다. #e91e63(방사성처럼 빛나는 마젠타) 위에 흰색 텍스트, 대비 비율 4.34:1.