Skip to content

feat: Improve dark mode UI readability and visual consistency in Customization Studi #883

Description

@SOHALIYAJAY

Is your feature request related to a problem? Please describe.

The current dark mode UI of the Customization Studio page looks visually cluttered and difficult to read.
Several sections blend too much into the background due to very low contrast, excessive dark shades, and inconsistent spacing.

Problems noticed:

The interface feels overly “muddy” and visually heavy in dark mode
Borders, cards, and sections are not clearly separated
Text readability is reduced because of weak contrast
Input fields and controls look compressed and outdated
The overall page lacks modern visual hierarchy and balance
Some UI elements appear crowded, especially inside the sidebar controls section

This affects the overall user experience and makes the customization page look less polished despite having powerful functionality.

I have attached a screenshot for reference.

Image Image

Describe the solution you'd like

I would like the dark mode UI to be redesigned/refined with a cleaner and more modern appearance.

Suggested improvements:

Improve contrast between background, cards, and input containers
Add cleaner shadows/glow effects for better depth
Use a more balanced dark color palette instead of pure dark gray/black everywhere
Increase spacing/padding between sections
Improve typography visibility and hierarchy
Modernize form controls, buttons, sliders, and dropdowns
Add subtle hover/focus states for better interactivity
Improve alignment consistency across panels
Enhance the live preview section visually to make it stand out
Make the page feel more premium and less cluttered

Possible UI inspiration:

Modern dashboard-style layouts
Glassmorphism / soft neon accents
Cleaner card separation
Better responsive spacing

Describe alternatives you've considered

Some alternative ideas considered:

Adding a light/dark theme toggle
Using slightly lighter dark backgrounds (#111827 / #1F2937 style palette)
Introducing bordered card layouts instead of flat sections
Adding theme presets for different visual styles

However, a general UI/UX cleanup and visual refinement for the current dark mode would already significantly improve the overall experience.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions