<?xml version="1.0" encoding="utf-8"?>
Open full project

The color system for UXcel is designed to create a cohesive and intuitive user experience while aligning with the brand's identity and usability principles. The palette balances vibrant accent colors for interactivity with neutral tones that ensure accessibility and readability.

Core Elements:

  1. Primary Colors: A bold and recognizable shade is used to highlight key actions and brand elements, ensuring consistency across all touchpoints.
  2. Secondary Colors: Complementary hues provide variety for secondary actions, navigation, and visual hierarchy.
  3. Neutral Palette: A gradient of whites, grays, and blacks supports text, backgrounds, and subtle elements, ensuring clarity and focus.
  4. Feedback Colors: Purposeful use of green for success, red for errors, yellow for warnings, and blue for informational states reinforces immediate understanding.
  5. Background and Surface Colors: Subtle and soft tones create a clean canvas, allowing interactive elements to stand out.

Usability and Accessibility: The system adheres to WCAG standards for color contrast, ensuring readability for all users. Interactive states, such as hover and active, are differentiated with slight tonal shifts, providing visual feedback.

Tools used

Figma

From brief

Topics

Share

Share your insights — leave a project review and help others grow their skills

Reviews

1 review


Excellent color system! Vibrant and well-organized palette with clear categorization. Great work!


5 Claps
Average 5.0 by 1 person
5 claps
4 claps
3 claps
2 claps
1 claps
<?xml version="1.0" encoding="utf-8"?>