Article below last updated on
Random colors for any purpose
Whether you're seeking inspiration for some graphics you're designing, or if you're creating a website, our random color generator has you covered. Color hex codes are given for every color generated here at Sylty.
We also show how these colors would look with white text and with black text on them, to help you get an idea how you'd like to use them.
If you don't like any of the colors generated, just press "Generate New". Be warned though - you can't get the old colors back, so if there's anything you like, copy and save the hex codes before pressing the button.
There's something here for everyone. With an almost infinite amount of colors that can be generated, you have plenty of options to pick from.
How we generate the colors
These colors are as random as possible. They are generated by picking a random one from every possible one of the hex letters at each of the 6 different positions of the hex code.
The color names shown here (e.g. happily, dimly, cleverly, etc) are just temporary names that we use as placeholders. If you need to use these colors, for the sake of your own convenience you should probably rename them to whatever you want. We wanted to be sure the names we gave didn't conflict with other existing color names you may be using in your project (e.g. light green).
The color names that we have given may get re-used for other colors that are generated using "Generate New", so don't assume that our names are unique to a specific color. It's even theoretically possible (but unlikely) for two different colors on the same page to have the same name.
For web designers
If you're planning on using these colors for the web, you'll want to copy and paste the CSS code for that color (shown above in the color boxes) into your existing stylesheet. Remember to decide whether you want the version with black text or with white text, as their CSS code is different. As mentioned above, you'll need to change the color name in your CSS file to something that is ideally a) meaningful to you color-wise and b) not already in use under the same name in your existing stylesheet.
All of our placeholder names end in "ly" to make it just a little easier if you need to search your stylesheet for any ones you may have forgotten to modify.
After copying the CSS code into your stylesheet, you can use any of these colors as follows:
In the above example you can see that I've changed the color to my own name, in this case "color-bestbutter".
Dark backgrounds will automatically come with white text, so you won't need to specify background color and text color separately.