Border: Input Fields e Counter

[annefranca]

Goal

Discutir e avaliar a proposta para a alteração do token aplicado na borda dos componentes Input Fields e Counter.

Context

Algumas normas da WCAG, como o critério de sucesso 1.4.3, definem que o contraste entre o texto e o fundo deve ser suficiente para garantir a legibilidade. Assim, contraste mínimo de 3:1 em relação ao fundo, já atenderia as normas para elementos como campos de entrada de dados.

Atualmente a borda dos componentes Input Fields e Counter não passam no contraste mínimo mencionado acima, com isso, nossa proposta é alterar o token de border para control para assim atender ao critério de sucesso da WCAG, pois um contraste inadequado pode tornar esses elementos indetectáveis ou difíceis de serem diferenciados, especialmente em condições de iluminação variada ou para pessoas com deficiência visual.

Impact

Ao implementar a alteração do token mencionado, essa alteração não só atenderá às normas de acessibilidade, mas também melhorará a experiência geral do usuário, promovendo inclusão e acessibilidade em seus produtos digitais. Essa abordagem não apenas beneficia usuários com deficiências, mas também aprimora a usabilidade de todos, refletindo práticas de design inclusivo.

Discussion Questions

N/A

Additional considerations

No response

Do you have a visual proposal?

https://www.figma.com/design/v3mdLLThoxud1ojhshK8q8/Border%3A-Input-Fields-e-Counter?node-id=6883-16290&t=0tOBebUCscwshQUE-1

[AnaMontes11]

hi @annefranca
Perfect, we'll create a ticket for this.
Upon review, we noticed that the new proposal is very similar to Grey 4. If you agree, we believe the best approach would be to modify Grey 4 (#999999 → #949494). With this adjustment, the control elements will also be accessible. Thanks!

[annefranca]

Obrigada! Você tem alguma precisão para essa modificação:

[AnaMontes11]

#2062