Design Summary
The "Welcome Back" screen presents a visually appealing and well-structured login experience with a warm aesthetic. However, significant issues exist with text contrast and legibility, particularly for secondary information like "Forgot Password" and "Keep me signed in," which negatively impact accessibility and usability.
Design Frame
Run Your Own Audit in Figma
Install Yo for FigmaKeep me signed in checkbox label
The text "Keep me signed in" has very low contrast against the white background, making it difficult for users, especially those with visual impairments, to read.
💡 Recommendation:
Adjust the text color to meet WCAG contrast guidelines (e.g., a darker grey or black) to ensure readability.
Forgot Password link
The "Forgot Password" link suffers from poor color contrast against the white background, making it hard to perceive and interact with.
💡 Recommendation:
Darken the text color of the "Forgot Password" link to ensure it meets accessibility contrast standards.
Forgot Password link
The "Forgot Password" text is too small and has insufficient contrast against the white background, hindering readability and discoverability.
💡 Recommendation:
Increase the font size and ensure sufficient color contrast for the "Forgot Password" link to improve legibility and accessibility.
Email and Password labels
The orange/brown color used for the "Email" and "Password" labels may not provide sufficient contrast against the white background for all users, potentially causing legibility issues.
💡 Recommendation:
Verify the contrast ratio of the "Email" and "Password" labels against the white background and adjust the color if necessary to meet WCAG AA standards.