Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Many company logos on the fundraiser page are unreadable in dark mode #1431

Open
kevinrenskers opened this issue Nov 21, 2023 · 1 comment
Open

Comments

@kevinrenskers
Copy link

Many of the logos on https://www.djangoproject.com/fundraising/ are very badly readable in dark mode:

@PANKAJ11111111
Copy link

Give chance i try
Adjust Logo Colors:

Ensure that the logos have a color scheme suitable for dark mode. Darken or lighten the logos as needed to improve contrast against the background.
Implement Logo Versions:

Create alternate versions of logos specifically designed for dark backgrounds. These versions can have adjusted colors or increased contrast to make them more visible.
Background Contrast:

Check the background color in dark mode. If the logos are still not readable, consider adjusting the background color to enhance the contrast.
Text Labels or Tooltips:

Provide text labels or tooltips when users hover over the logos. This ensures that even if the logos are not immediately readable, users can get information about the companies.
Border or Outline:

Add a subtle border or outline to the logos to distinguish them from the background. This can enhance visibility, especially if the logos have intricate designs.
Grayscale Conversion:

Convert the logos to grayscale in dark mode. This can sometimes improve readability by removing color complexities.
Use SVGs:

If possible, use SVG (Scalable Vector Graphics) format for logos. SVGs can be easily manipulated and recolored with CSS, providing more flexibility for adjusting their appearance in different modes.
Testing with Users:

Conduct usability testing with users who are likely to view the fundraiser page in dark mode. Gather feedback on the visibility of logos and use that input to make further improvements.
Toggle Switch:

Consider adding a toggle switch that allows users to switch between light and dark modes manually. This gives users control over their preferred viewing mode.
Provide User Preferences:

Allow users to customize their viewing preferences, including the ability to choose from a selection of color themes. This way, users can pick a theme that best suits their needs.

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

No branches or pull requests

3 participants