Background Color Generator

About this plugin

Summary:

This plugin is ideal for B2B products where you want to integrate a client’s branding color into background designs while maintaining accessibility and strong visual contrast.

How to use:

Pick a color using the hue slider or a HEX code. Select the layer you want to apply the color to, then simply click the button to apply it. The plugin generates light and dark variations with the same hue.

Accessibility Compliance:

This plugin follows the WCAG 2.1 guidelines for color contrast:

1. The light color is optimized for contrast against 87% black (#161616), and the dark color against white (#FFFFFF).
2. For normal text (below 18pt bold / 24pt regular), the minimum contrast ratio is 4.5:1.
3. For large text (18pt bold or 24pt regular and above), the minimum contrast ratio is 3:1.
4. The generated light and dark color combinations exceed these minimum requirements, ensuring better readability and accessibility for users with visual impairments.

(Note: I made this plugin from Ai integrated in VS code. If you want to know more about what I do at work, you can check Daidai )