One of the most frequent tasks that we do with any web-based MVP (Minimum Viable Product) is setting up some sort of bootstrap boilerplate with preconfigured color scheme usually based on some logo or brand guidelines.
I use this huemint to get some randomized colors in addition to creating mockups. What is unique about this palette generator is that it uses AI/ML to know which colors are meant to be the background, which are meant to be the foreground, and which are meant to be accents.
You can also upload a logo to extract the colors here.
Alternatively, you can use the random color generator and get the sass color code here.
They explain how they apply AI/ML in their about page. They built an ML model that was trained on many design thumbnails from the web (the 3D visualization is really nice!)
They even provide a free API that can be used to generate color palletes:
const json_data = {
// transformer, diffusion or random
"mode":"transformer"
// max 12, min 2
"num_colors":4,
// max 2.4, min 0
"temperature":"1.2",
// max 50 for transformer, 5 for diffusion
"num_results":50,
// nxn adjacency matrix as a flat array of strings
"adjacency":[ "0", "65", "45", "35", "65", "0", "35", "65", "45", "35", "0", "35", "35", "65", "35", "0"],
// locked colors as hex codes, or '-' if blank
"palette":["#ffffff", "-", "-", "-"],
}
$.ajax({
type: "post",
url: "https://api.huemint.com/color",
data: JSON.stringify(json_data),
contentType: "application/json; charset=utf-8",
dataType: "json"
});
On a side note, another website that will give you stylized bootstrap CSS/SASS is bootswatch. The nice thing about bootswatch, is that it is different enough to make bootstrap less boring.