Opened 7 months ago
Closed 4 months ago
#34910 closed Bug (fixed)
Color Contrast Admin Plus Icon
| Reported by: | laserhyena | Owned by: | Hisham Mahmood |
|---|---|---|---|
| Component: | contrib.admin | Version: | dev |
| Severity: | Normal | Keywords: | accessibility, color contrast |
| Cc: | Triage Stage: | Accepted | |
| Has patch: | yes | Needs documentation: | no |
| Needs tests: | no | Patch needs improvement: | no |
| Easy pickings: | no | UI/UX: | yes |
Description
Identified using automated checks with Axe. When in Light Mode/Theme, Axe reports a contrast ratio of 2.2:1 for the Django Admin's plus icon. For icons, this should be at least 3:1, as seen in the W3C documentation for Technique G207.
To reproduce, visit the Django Admin and locate one of the green plus symbols. Potential new value for the green is represented by # 5fa225.
Please note the new green should result in acceptable color contrast for both Light and Dark mode.
Change History (6)
comment:1 by , 7 months ago
| Owner: | changed from to |
|---|---|
| Status: | new → assigned |
| Triage Stage: | Unreviewed → Accepted |
comment:2 by , 4 months ago
Admin change icon needs better contrast too.
Comparison of before/after color, confirming the proposed shade: contrast-grid.
comment:3 by , 4 months ago
| Has patch: | set |
|---|---|
| Owner: | changed from to |
Pull request: https://github.com/django/django/pull/17744
comment:4 by , 4 months ago
| Patch needs improvement: | set |
|---|
Setting as patch needs improvement following Thibaud's comment.
Thank you @laserhyena!
Link to technique: https://www.w3.org/WAI/WCAG21/Techniques/general/G207.html
Comparison of before/after color, confirming the proposed shade: contrast-grid.