a lil tut on how to make custom spacehey logos for your page!
reminder: covering up the spacehey logo is against spacehey's html rules. so if you want a custom logo, at least have the name on there!
css codes to customize logo:
if you want to use a photo, use this code:
if you want a logo like mine, download the spacehey logo at:
[ https://spacehey.com/brand ]
and then edit it however you want. remember, fully covering the logo is against the rules!
<style>
.logo {
content:url("DIRECT_PHOTO_LINK_HERE");
}
</style>
if you want to only edit the color of the logo, use this code:
<style>
.logo{
nav img.logo {
filter: invert(87%) sepia(32%) saturate(400%) hue-rotate(179deg) brightness(600%) contrast(100%);
\\the code above changes the color of your logo. to find the color of your choice, find it at https://codepen.io/sosuke/pen/Pjoqqp and replace the old code with the code it gives you
!important;
}
</style>
FAQ - Read this before asking anything!
"how do i add this into my layout?!":
copy the css code of your choice and paste it into your about me.
if you already have a css code in your about me, you can ignore the <style>'s and copy whats inbetween. After that you can paste it in the middle of your code, just remember that it has to be inbetween <styles>'s.
"how do i edit logos?":
download the resources from [ https://spacehey.com/brand ]
then use any photo editor of your choice to edit it how you want. i just used picsart for mine.
"my logo is stretched out/squished!":
your logo needs to be the exact same size as the spacehey logo photo.
have fun! if your question isnt on the FAQ, i will try to help in comments!
Comments
Displaying 19 of 19 comments ( View all | Add Comment )
tirotastic
Thanks a lot! Personally I had some issues w/ initially setting it up, I'm still not sure why, maybe it was conflicting with another code. But if anyone's possibly having those same issues, with the spacehey logo colour not changing this is what I wrote instead:
style
.logo{
filter: invert(47%) sepia(56%) saturate(930%) hue-rotate(14deg) brightness(93%) contrast(102%);
}
style
(i did put the actual "style" command with the >< >/< and all)
Report Comment
vivian
Hi is there any code to change the ‘a space for friends’ text?
Report Comment
Ryan!
TYSM!! USED :3
Report Comment
Ria bo bia
is there anything I can enter to change the size??
Report Comment
Ghost
Using! Thnx a ton!! <3
Report Comment
Squeezynutz
Thank youuu
Report Comment
𝓕𝓡𝓔𝓐𝓚𝓨 👅 OLIVE!
how exactly do I change the image so it's the same size as the spacehey logo?
Report Comment
⋆༺𓆩Xenomorph𓆪༻⋆
thank youuu!!! <3
Report Comment
BabyD2sh♡_♡
Heey! It helped me a lot (now I'll have to look for an image hehe, but it worked!)
Report Comment
xofrnk
mine's not working. Here's the code I used: .logo{
nav img.logo{
filter: invert(15%) sepia(26%) saturate(6537%) hue-rotate(347deg) brightness(92%) contrast(93%);
!important;
}
does it need to be in a specific part of my full code or is part of it wrong?
Report Comment
Idk why the original post specific to add an extra ".logo{." This should work:
nav img.logo{
filter: invert(15%) sepia(26%) saturate(6537%) hue-rotate(347deg) brightness(92%) contrast(93%);
!important;
}
by Izzy; ; Report
thanks!! I got it to work
by xofrnk; ; Report
𝓈𝒶𝓇𝒶𝒽 💋
I used this and it worked, but it compresses my image and makes it short, how can I fix this? I already tried making the original image longer but it still does the same thing.
Report Comment
Pineie / Charlie ๋࣭ ⭑
I put a custom logo on my blog but the theme has the logo set to be purple and I can’t get rid of that. I’m trying to look for this type of code but I can’t, can anyone help?
Report Comment
nvm I figured it out!! ctrl + f and then the word “filter”
by Pineie / Charlie ๋࣭ ⭑; ; Report
roe xx
what is the exact code that you used for your spacehey logo bar? i do not know how to code at all, ty xx
Report Comment
Chalamlangla
i try to change it to my custom logo but it wont show :(
Report Comment
Same, Mabye the code is outdated?
by Starz; ; Report
mr.owen
thank you so much!!!!
Report Comment
wilbo baggins
im trying to change it to red and it's not working:( i copied your code and replaced the color like u said and it doesn't do anything
Report Comment
nina...
ty this helped a lot
Report Comment
Cocaine Angel
Thank you for this .
Report Comment
Rat
you are amazing thank you!!!
Report Comment