All of us love a good Figma plugin. Unsplash, Iconify, and Lorem Ipsum are lifesavers for builders. Might UIColors be the subsequent useful addition to the net designer’s ever-growing toolbox? We actually assume so.
UIColors makes use of Tailwind CSS to make discovering complementary coloration schemes simpler. Designers can both enter a hex code manually, change the HSL values, or press the spacebar to choose a random coloration palette. Then, the script generates a coloration scale with ten totally different complementary shades.
To maintain issues easy, let’s go for good-old #FF0000, extra generally often known as ‘shiny pink’.
Once we enter the hex code into the generator, it instantly creates our coloration scale. Every new coloration is accompanied by a hex code that I can copy to my clipboard with a single click on.
UIColors additionally creates a set of examples so that you could assess how the colours work in follow. From illustrations and calendars to gradients and on-site buttons, you’ll have the ability to see exactly how totally different shades will look if you add totally different options to your web site.
We’re simply scratching the floor of UIColors’ capabilities right here. The device additionally means that you can create totally different variables, types, and coloration guides based mostly on the scales you generate. You’ll be able to attempt it out right this moment by visiting the UIColors website or putting in it via Figma. Who is aware of? This utility would possibly simply turn into your new finest buddy.
Shelley Cooke
Shelley Cooke is a blogger and podcaster from Asheville, North Carolina (Go Oilers!). She’s obsessed with know-how and the position it performs in constructing communities.
#UIColors #CSS #Generate #Customized #Colour #Scales #Designers