Choosing colors for website elements based on logo colors

I am new to UX design (zero sense on choosing colors) and designing my fist website (social networking) based on the logo I have. My logo colors are teal and orange. Based on these colors how do I determine what colors should go well for different elements?

For example; the background color for website (for example if we look at Facebook, based on their blue color logo they use an AliceBlue EDF0F5 background color), regular text color, heading color, link color, div border color, link hover color, subheading color, subheading background color?

Are there any tools to generate these colors automatically? I am following Google Material Design guidelines but when choosing the colors for the different elements it is all getting messed up (loosing clarity in typography).


For color ideas go here:

Then take the hex value and play around in either of these color palette-generating tools:

Here is a screenshot of Paletton in action using CINNABAR F03434 from Flat UI Color Picker (you can get the hex values by cliking on any of the colors in the palette on the right)

enter image description here

Source : Link , Question Author : Bujji , Answer Author : I Heart Beats

Leave a Comment