« Web, HTML, Tech Forum

Spacehey logo color?

Posted by astralkyouki

posted
updated

Forum: Web, HTML, Tech

I'm trying to change the color of the Spacehey logo on my profile as well as the text "Search Users" and "Help/LogOut." However, I can't figure out what part of my code changes this?


Report Topic

3 Replies

Sort Replies:

Reply by Utility

posted
updated

Changing the color of the logo can be a bit tricky considering that the logo is an image, not a text element. You can change the color of the image by adding a sepia filter along with a hue-rotate filter to give it some color. We will also add a saturate filter to make the color pop a bit more :)


.logo {
   filter: sepia(100%) hue-rotate(45deg) saturate(100);
}


Make sure to play with the hue-rotate() filter to get the color you want :)
You can also modify the saturate() filter to make the logo less/more saturated.
Hope this helps!

hue-rotate(0deg): standard white
hue-rotate(45deg): green
hue-rotate(95deg): cyan
hue-rotate(200deg): light pink
hue-rotate(250deg): darker pink
hue-rotate(300deg): orange
hue-rotate(350deg): yellow


Report Reply

Reply by pilmo_6

posted

does anyone know the color to make it black?


Report Reply

Reply by xofrnk (token prep)

posted
updated

Anyone know how to make it dark red/maroon? I've been struggling for almost an hour now lol. Edit: okay, I got it. for inquiring minds who need to know, the code is 

.logo {

   filter: sepia(100%) hue-rotate(300deg) saturate(400) brightness(50%);

}

and you can play with the numbers until it's exactly what you want


Report Reply