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 16 of 16 comments ( View all | Add Comment )
Ghost
Using! Thnx a ton!! <3
Squeezynutz
Thank youuu
𝓕𝓡𝓔𝓐𝓚𝓨 👅 OLIVE!
how exactly do I change the image so it's the same size as the spacehey logo?
⋆༺𓆩Xenomorph𓆪༻⋆
thank youuu!!! <3
BabyD2sh♡_♡
Heey! It helped me a lot (now I'll have to look for an image hehe, but it worked!)
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?
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.
Pineie / Charlie ๋࣭ ⭑![💻](https://static.spacehey.net/emojis/v1/laptop2.png)
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?
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
Chalamlangla
i try to change it to my custom logo but it wont show :(
Same, Mabye the code is outdated?
by Starz; ; Report
mr.owen
thank you so much!!!!
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
nina...
ty this helped a lot
slenders_kid
what are the measurements for the spacehey logo?
Cocaine Angel
Thank you for this .
Rat
you are amazing thank you!!!