Accessibility bug - Ensure active user interface components have sufficient contrast
Describe the problem
The color contrast ratio of the active focus outline for the "Show/Hide Password" button is less than 3.0:1. There are focus outlines for elements with a contrast ratio below 3.00:1.
Foreground color: #FBEDED Background color: #FFFFFF Contrast ratio: 1.13:1
Expected fix
Ensure active focus outline for user interface components has sufficient contrast. The required minimum contrast ratio is 3.00:1.
Common examples of qualifying components include text field borders, check marks for checkboxes, fillings for radio buttons, focus indicators, and icon-only controls. Non-interactive controls are exempt from this requirement.
On which browser(s) did you experience this issue?
No response
Additional context
For more information about Non-text Contrast, please see the W3C Web Accessibility Initiative's ARIA Authoring Practices Guide: https://www.w3.org/WAI/WCAG22/Understanding/non-text-contrast.html
I would like to fix this problem.
- [x] #12412
Hi team,
Just following up on this issue — it’s been open for a month and was flagged by an accessibility consultant as a violation.
Is there any update or someone who could take a look? Happy to provide more details if needed.
Thanks!
Bump this Accessibility Bug
@parlough, can you take a look?
@parlough Any Update on this?
Hi, @yoshjurkic, while this is important, @parlough is super busy. He recently finished porting the Dart website to Jaspr, so now it uses Dart. He's doing the same for the Flutter website.
Hi @sfshaza2 & @parlough, thanks for the update and congrats on the Dart website migration to Jaspr that’s a big milestone! Totally understand you're deep in the Flutter website porting work. Just wanted to keep this accessibility issue visible, as it’s native to Flutter and impacts users relying on assistive technologies. We’re happy to provide additional context or help validate fixes when the time is right. Appreciate all the work you're doing looking forward to seeing the improvements roll out!
Hey, @yoshjurkic, I briefly discussed this issue with @parlough last week. Are you filing this bug specifically against the Flutter website? Or is this an issue against the Flutter SDK?
Hi @sfshaza2, This appears to be native to the Flutter SDK itself.
Thanks,
Yosh
From: Shams Zakhour @.> Date: Tuesday, October 7, 2025 at 8:11 PM To: flutter/website @.> Cc: Yosh Jurkic @.>, Mention @.> Subject: Re: [flutter/website] Accessibility bug - Ensure active user interface components have sufficient contrast (Issue #12226) CAUTION: This email originated from outside of the organization. Do not click links or open attachments unless you recognize the sender and know the content is safe.
[Image removed by sender.]sfshaza2 left a comment (flutter/website#12226)https://github.com/flutter/website/issues/12226#issuecomment-3379110873
Hey, @yoshjurkichttps://github.com/yoshjurkic, I briefly discussed this issue with @parloughhttps://github.com/parlough last week. Are you filing this bug specifically against the Flutter website? Or is this an issue against the Flutter SDK?
— Reply to this email directly, view it on GitHubhttps://github.com/flutter/website/issues/12226#issuecomment-3379110873, or unsubscribehttps://github.com/notifications/unsubscribe-auth/BU6GWXHG4UQTT7EPMQ55JBL3WRJCRAVCNFSM6AAAAACCAJOITCVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZTGNZZGEYTAOBXGM. You are receiving this because you were mentioned.Message ID: @.***>
Hi, @yoshjurkic! If that's the case, this is filed on the wrong repo. You should file this against the flutter/flutter repo. This repo is purely for our website.