forum

Skinning tutorial (+ skinning support)

posted
Total Posts
4,226
show more
shtolen
Hi. First skinning expirience ever. So I'm trying to make my own skin based on a few other skins. And this is what happenened to the ranking screen. All the elements are out of place. Idk why, I tried to copy all the files from the original skin (that is angelsim's skin) related to the ranking panel, but result is still the same. Help me please.
http://puu.sh/ymQFx/e1b186246d.osk
Rio-

shtolen wrote:

Hi. First skinning expirience ever. So I'm trying to make my own skin based on a few other skins. And this is what happenened to the ranking screen. All the elements are out of place. Idk why, I tried to copy all the files from the original skin (that is angelsim's skin) related to the ranking panel, but result is still the same. Help me please.
http://puu.sh/ymQFx/e1b186246d.osk
Replace the line "Version: 1.0" to "Version: 2" or "Version: latest"... In Your skin.ini (from your skin folder)

Name: Angelsimxshtolen
Author: shtolen
Version: latest

* Also I downloaded Your skin and tried changing the version. And the elements aren't out of the place anymore. (no Screenshot but You can try it)
shtolen

Rio- wrote:

* Also I downloaded Your skin and tried changing the version. And the elements aren't out of the place anymore. (no Screenshot but You can try it)
Oh, my bad. Huge thanks!
Humanity

h3oCharles wrote:

Humanity wrote:

Some of the skin elements I make have these ugly gray lines on the borders. How do I fix that? What do you think I'm doing wrong?
screenshots plz

If you take a look at the ranking letter, you can see there is a gray line on the border. that happens with my mods as well. idk how to fix it.
45Traeath
Given that the system uses the images in the Skin's folder, something must have caused the final edition to have the said border.
(There shouldn't be any border, if you didn't make any while using an edition softw'.)
In easy words, you might have to remake the elements in which their background has this problem.
If - even after painting the background in the wanted color - the problem's still here, I don't know how to help.
Humanity

45Traeath wrote:

Given that the system uses the images in the Skin's folder, something must have caused the final edition to have the said border.
(There shouldn't be any border, if you didn't make any while using an edition softw'.)
In easy words, you might have to remake the elements in which their background has this problem.
If - even after painting the background in the wanted color - the problem's still here, I don't know how to help.
Looking at the files, there appears to be no gray border in them. However when they show up in osu!, the gray border appears.
H1kikomori
I have a problem i have selection mode and @2x but i can't see it ingame what should i do?
https://imgur.com/zUprERc

https://imgur.com/5HH0eUW
Lyawi

H1kikomori wrote:

I have a problem i have selection mode and @2x but i can't see it ingame what should i do?
https://imgur.com/zUprERc

https://imgur.com/5HH0eUW
check if the file names have no spaces.
farsdewibs0n
is there osu!default skin template?
h3oCharles

farsdewibs0n wrote:

is there osu!default skin template?
Here, have fun!
Pikku Masa
what about the slider "wall" or "outline"
h3oCharles

Mazsaa wrote:

what about the slider "wall" or "outline"
in skin.ini under Colours you can change them with rgb notations

SliderBorder for the outline
SliderTrackOverride for the wall

beware that SliderTrackOverride will change ALL of the sliders colors, otherwise they'll be colored in combo colors
popcornrus
thankq
KanekoSempaii
.
h3oCharles

KanekoSempaii wrote:

Tell me, how can I put the skin on the site?
Read the Skinning rules, If any of the points aren't broken, make a new topic
Otherwise, put it on your userpage
liujunjie123
wow
ReLT
can I create animated buttons in pause/lose menu :?: :?:
RockRoller

R3LTi wrote:

can I create animated buttons in pause/lose menu :?: :?:
No
FelissieFenessa
How to make each mania keys have different color? Like rainbow 7k. I saw most skin only have 3 sets of color(K1,3,5,7|K2,4,6|Special).
h3oCharles

FelissieFenessa wrote:

How to make each mania keys have different color? Like rainbow 7k. I saw most skin only have 3 sets of color(K1,3,5,7|K2,4,6|Special).
It's all in skin.ini
go to:
Skinning Forum -> Important Guides and Threads -> h3oCharles' Skinning Book -> That spreadsheet

Once you got to the spreadsheet, go to skin.ini -> [Mania]
If you need more help than this, please forum PM me
Asura Yuuki
Where can I download efx/voice for ComboBurst or ComboBreak and etc.
Please answer
wahyupn
how to make number of score and accuracy look different
RockRoller

Asura Yuuki wrote:

Where can I download efx/voice for ComboBurst or ComboBreak and etc.
Please answer
YoutTube, Freesong.org or other skins

wahyupn wrote:

how to make number of score and accuracy look different
Thats not possible
davidsin02
How to do not full screen in the skin? Often Cookiezi use skins with “box” screen. I have one favourite skin and I want to do this skin with no full screen. I know about to change window option, but I mean how to change it inside skin.
You can see example on the image:
https://photos.app.goo.gl/RLYWAsKa0vwckL7s2
RockRoller

davidgod98 wrote:

How to do not full screen in the skin? Often Cookiezi use skins with “box” screen. I have one favourite skin and I want to do this skin with no full screen. I know about to change window option, but I mean how to change it inside skin.
You can see example on the image:
https://photos.app.goo.gl/RLYWAsKa0vwckL7s2
Use a blank scorebar-bg
Zypre
Is there any way to make my cursortrail shorter?
I'm using cursormiddle.png to make it nice and smooth, but it's huuuuuuuuugely long. Unfortunately, deleting cursormiddle.png makes it extremely short and choppy.
I made a comparison in the picture below. Moving my cursor in an infinity-loop at a medium speed.
Basically I want my trail to be like the top one, except maybe half the length. (And less bright, but that's just the nature of rainbows, can't fix that without breaking the universe...)
Neko67
Just a quick thing. If slider track override can change the colour of the slider, what would the values need to be to make it transparent?
Neko67

RockRoller wrote:

davidgod98 wrote:

How to do not full screen in the skin? Often Cookiezi use skins with “box” screen. I have one favourite skin and I want to do this skin with no full screen. I know about to change window option, but I mean how to change it inside skin.
You can see example on the image:
https://photos.app.goo.gl/RLYWAsKa0vwckL7s2
Use a blank scorebar-bg
My skin already had that but there is no box >.<
RockRoller

Neko67 wrote:

Just a quick thing. If slider track override can change the colour of the slider, what would the values need to be to make it transparent?
Adding transparency isn't possible. RGB gets used by osu' skin.ini and not RGBa (which would support transparency).
The nearest you can get to a transparent slider body is using 0,0,0.

ZypreToo wrote:

Is there any way to make my cursortrail shorter?
I'm using cursormiddle.png to make it nice and smooth, but it's huuuuuuuuugely long. Unfortunately, deleting cursormiddle.png makes it extremely short and choppy.
I made a comparison in the picture below. Moving my cursor in an infinity-loop at a medium speed.
Basically I want my trail to be like the top one, except maybe half the length. (And less bright, but that's just the nature of rainbows, can't fix that without breaking the universe...)
You will need to change the canvas size or the image size of your cursortrail.png
Zypre

RockRoller wrote:

ZypreToo wrote:

Is there any way to make my cursortrail shorter?
I'm using cursormiddle.png to make it nice and smooth, but it's huuuuuuuuugely long. Unfortunately, deleting cursormiddle.png makes it extremely short and choppy.
I made a comparison in the picture below. Moving my cursor in an infinity-loop at a medium speed.
Basically I want my trail to be like the top one, except maybe half the length. (And less bright, but that's just the nature of rainbows, can't fix that without breaking the universe...)
You will need to change the canvas size or the image size of your cursortrail.png
That will simply make each individual image smaller, but the trail won't be much shorter...
Though maybe if I only decrease the width, hmm... You've given me an idea! Thanks

EDIT: Nope, still just makes it smaller, not shorter.
45Traeath
"Spinner" and "Spinner-Metre" reverted to default, what do I do?

I have two folders, both are completely original (the first was made by a friend, I added some stuff in the second with a partial copy of the first).
The first version works in its respective folder, but the second doesn't when it's literally the same elements.
Zypre

45Traeath wrote:

"Spinner" and "Spinner-Metre" reverted to default, what do I do?

I have two folders, both are completely original (the first was made by a friend, I added some stuff in the second with a partial copy of the first).
The first version works in its respective folder, but the second doesn't when it's literally the same elements.
Make sure they're named correctly. spinner-circle.png , spinner-metre.png

And of course if you're using @2x.png versions, make sure that your screen resolution is in the HD range, otherwise it'll revert to the regular versions; Which will be the defaults if none exist.
45Traeath
All the names are checked.

There weren't any "2x" elements in the initial folder; so I modified the second folder's images towards "both directions":
- the SC's dimensions are 750x750 and the SM's are 1160x834
- I made images half as big and gave the "2x" name to the first edition, but it didn't work, so I made bigger images (and the other things to do in that situation)

Nothing solved the issue, even after reloading and rewriting the version in "Skin.ini".

(What surprises me is that Taiko uses them properly.)
Haskorion
Just add a spinner-background.png (can be a blank 1x1 pixel). That makes osu! use the old spinner (the one that uses the metre).
45Traeath
*Gives "Applause.wav"*

Problem solved with added BG, thank you ( '-')b
Hiss
https://puu.sh/zierw.png

How can I stop some hitcircles having 2 circles inside of it instead of one?
RockRoller

-Touka wrote:

https://puu.sh/zierw.png

How can I stop some hitcircles having 2 circles inside of it instead of one?
Go to your skin.ini and set HitCircleOverlap to the width of default-0.png
4sneKWolFirE
:shock:
How the hell do you get it to work?

I'm making a skin and I have what I want already, but I'm not sure how to apply it to the game.
I can post a screencap of the folder if needed.

I've tried putting input into the skin.ini but idk if my skin.ini is in the right format or what, but I just need help.

I have files for hitbursts, spinner background, and section pass/fail. 10 files in all, not counting the skin.ini.

So...what do I do to show the skin ingame?
:x :x :x :x :x :x
AkiraYasha
So I'm, like most people here, making a skin.

Now I have been working on a follow like for like, three days now but it never seems to work like I want it to.
I tried copying the style of another skin, where the ends of the line fade out.

like this
And basicly remade my follow point in the same way he had.

his files

my files, tho my follow line is white so you cant see it.

however, instead of the smooth, solid like he has, mine turns out to look like this ingame.


I can't really seem to find any 'tutorials' regarding follow lines like this, so I was wondering if someone here is willing to help me out and explain?
sarabugs72
This was extremely helpful, thank you. :
h3oCharles

AkiraYasha wrote:

So I'm, like most people here, making a skin.

I can't really seem to find any 'tutorials' regarding follow lines like this, so I was wondering if someone here is willing to help me out and explain?
make the line longer, that's the only solution. The problem is indeed happening, and there's no way of avoiding it, cuz the gaps depend on CS size, something we don't have control of.
FelissieFenessa
How to make perma-hidden skin for mania without messing with hit position?
h3oCharles

FelissieFenessa wrote:

How to make perma-hidden skin for mania without messing with hit position?
yes, you can make pixels above the keys to make it cover the notes, make sure you have enabled KeysUnderNotes:1 in Mania portion on skin.ini
davidsin02

RockRoller wrote:

davidgod98 wrote:

How to do not full screen in the skin? Often Cookiezi use skins with “box” screen. I have one favourite skin and I want to do this skin with no full screen. I know about to change window option, but I mean how to change it inside skin.
You can see example on the image:
https://photos.app.goo.gl/RLYWAsKa0vwckL7s2
Use a blank scorebar-bg
Thanks, that works
FelissieFenessa

h3oCharles wrote:

FelissieFenessa wrote:

How to make perma-hidden skin for mania without messing with hit position?
yes, you can make pixels above the keys to make it cover the notes, make sure you have enabled KeysUnderNotes:1 in Mania portion on skin.ini
Is there any limit how high can we hide playfield? or we can hide whole playfield if we want.
h3oCharles

FelissieFenessa wrote:

Is there any limit how high can we hide playfield? or we can hide whole playfield if we want.
in theory, you could hide the entire playfield, but that won't be practical.
Ryan Maulana
I'm a bit confused with making skin.ini
HyoukaForGC
Need help making the accuracy centered instead of being on the top right. I've tried skins that already have it(Some of Azer's skins) centered but it doesn't work in game for me.
h3oCharles

HyoukaForGC wrote:

Need help making the accuracy centered instead of being on the top right. I've tried skins that already have it(Some of Azer's skins) centered but it doesn't work in game for me.
score-percent is a very wide transparent rectangle.
Sky Pixel_old
Wow, great job m8
HyoukaForGC

h3oCharles wrote:

HyoukaForGC wrote:

Need help making the accuracy centered instead of being on the top right. I've tried skins that already have it(Some of Azer's skins) centered but it doesn't work in game for me.
score-percent is a very wide transparent rectangle.
It's not about the actually file, any skin I try with this accuracy centered does not work in game for me. I've tried making the transparent score-percent myself and adding it but it still does not work.
h3oCharles
have you tried reloading the skin with CTRL+SHIFT+ALT+S ?
HyoukaForGC
I've done that every time I add that file to the skin and when I add another skin that already has the feature in it
h3oCharles

HyoukaForGC wrote:

I've done that every time I add that file to the skin and when I add another skin that already has the feature in it
can you show this problem in more detail? use SHIFT+F12 to send screenshots
Daykeyboard
i'm trying to replace menu-background.png on a skin that I didn't make with a wallpaper, I already successfully cut from a song my own welcome.wav with Audacity so I thought it wouldn't be this hard to replace an Image
I have it named correctly and it's in 1920x1080, I don't know what I did wrong
h3oCharles

Daykeyboard wrote:

i'm trying to replace menu-background.png on a skin that I didn't make with a wallpaper, I already successfully cut from a song my own welcome.wav with Audacity so I thought it wouldn't be this hard to replace an Image
I have it named correctly and it's in 1920x1080, I don't know what I did wrong

check Frequently Asked Questions
jwestcott1
I have a skin that i downloaded, but the circles you have to click dont have a barrier around them, making it hard to judge when to click, does anyone know which file in the folder i would have to change to fix this, and how i could do it, pls help.
Mikojel
So i have problem in skinning, how the heck to remove hitcircle from the end of slider!
RockRoller

Mikojel wrote:

So i have problem in skinning, how the heck to remove hitcircle from the end of slider!

Add a blank sliderendcircle.png
h3oCharles

jwestcott1 wrote:

I have a skin that i downloaded, but the circles you have to click dont have a barrier around them, making it hard to judge when to click, does anyone know which file in the folder i would have to change to fix this, and how i could do it, pls help.


approachcircle
makemecool123
Wait, where the two template?
f5104
Thanks, that's a good tutorial.
BaoHoangDZ
You can make for me one skin osu! with anime character name: Shachi Yuuri
SheepeyDarkness
I'm currently making an original skin. I can do graphics all fine and don't need them from other skins. If I take hit sounds from another skin is that considered a mix skin? Would I have to make or find them myself?
RockRoller

SheepeyDarkness wrote:

I'm currently making an original skin. I can do graphics all fine and don't need them from other skins. If I take hit sounds from another skin is that considered a mix skin? Would I have to make or find them myself?
Using others sounds is fine, but it would be nice to give credit if you know the source.
Hikage
Quick question, can I have multiple applause sounds in a skin? In the same way you can have multiple comboburst.wav with comboburst-(n).wav, can I have applause-(n).wav?
RockRoller

Hitei wrote:

Quick question, can I have multiple applause sounds in a skin? In the same way you can have multiple comboburst.wav with comboburst-(n).wav, can I have applause-(n).wav?
No
Nearling
How to change the thickness of the slider contour? I tried everything I can, I can not figure it out
http://prntscr.com/jfdfah
RockRoller

Nearling wrote:

How to change the thickness of the slider contour? I tried everything I can, I can not figure it out
http://prntscr.com/jfdfah
Thats not possible
Nearling
Well, then how do you change the color of this outline? And something else, how to remove the number on the circle
RockRoller
Theres a command in the skin.ini its under [Colours] and it is named SliderBorder.

You just want to remove the numbers or you want to replace them?
Nearling
To remove absolutely, only now has paid attention, that they are useless)
RockRoller

Nearling wrote:

To remove absolutely, only now has paid attention, that they are useless)
Go in your skin.ini and go to [Fonts]. Type:
HitCirclePrefix: useless

Reload your skin and the numbers should be gone
Nearling
-Yuno Gasai-
How can I remove lighting effects when star2 is happening in-game?

Is it linked with star2?

Because I use pale color so the lighting LITERALLY kill my eyes.

I cant support it with the new color I use the star2 is fine but that god damn lighting.

Also I already disabled the "hit lighting" thing im talking about the effect of lighting do I have to make en empty file called lighting?
RockRoller

TheSatanicAngel wrote:

How can I remove lighting effects when star2 is happening in-game?

Is it linked with star2?

Because I use pale color so the lighting LITERALLY kill my eyes.

I cant support it with the new color I use the star2 is fine but that god damn lighting.

Also I already disabled the "hit lighting" thing im talking about the effect of lighting do I have to make en empty file called lighting?


I don't reay vet what the problem is.. Try making an empty lighting.png
1ben984342
Hello, this might be a little more advanced than the things mentioned above, but I have seen a skin that makes the osu!mania stage move to the center of the screen instead of staying slightly towards the left, so I tried it for myself but can't seem to make it work.

Any ideas of how to actually do that?
RockRoller

1ben984342 wrote:

Hello, this might be a little more advanced than the things mentioned above, but I have seen a skin that makes the osu!mania stage move to the center of the screen instead of staying slightly towards the left, so I tried it for myself but can't seem to make it work.

Any ideas of how to actually do that?

https://osu.ppy.sh/forum/p/2327816
This should be it
GemmaKujo
Hey I'm kinda new to skinning so this might be a stupid question but I have a little problem with my spinner.. I wanted to make one myself but the default spinner always shows up and idk how to change that. https://osu.ppy.sh/ss/10984769
vanessahime
tell us too about converting .osk file into another format such as .zip or .rar
Dwoldy
Can i use score numbers and hitcircle numbers from other skin and post my skin on forum with them?
P.S. Sorry for my english
h3oCharles

GemmaKujo wrote:

I have a little problem with my spinner.. I wanted to make one myself but the default spinner always shows up and idk how to change that.


set Version to latest in skin.ini

vanessahime wrote:

tell us too about converting .osk file into another format such as .zip or .rar


CTRL+O -> Skin -> Export as .osk


Dwoldy wrote:

Can i use score numbers and hitcircle numbers from other skin and post my skin on forum with them?


Mixed skins are not allowed on the forum. You can post it on /r/osuskins or on your userpage if you have one
-Deer Lu-
how to update the theme with my skin,so that the subject was visible on the forum?
h3oCharles

-Deer Lu- wrote:

how to update the thread with my skin,so that the subject was visible on the forum?

There should be a button on the post that says edit or sth like that
Katxu
This topic should be updated, some features doesnt work anymore like the "SongSelectActiveText".
Reply me if it does work but i don't know how to use it properly.
Haskorion

IFT Seb wrote:

This topic should be updated, some features doesnt work anymore like the "SongSelectActiveText".
Reply me if it does work but i don't know how to use it properly.

It does work.

Often made mistakes in the skin.ini-file are:
  1. lowercases where they should not be: (e.g.: version instead of Version.
  2. incorrect spelling (e.g.: Colors instead of Colours)
  3. having spaces before or after the line
  4. using a variable that is not supported
  5. not putting a line under their correct header (e.g.: ComboPrefix: must be put under the [Fonts] section)
  6. forgetting to put the headers into brackets (these -> ["Header"] )
  7. the file is not an .ini-file (skin.ini.txt instead of skin.ini)

In short: the skin.ini-file is very case sensitive and uses UK english for most parts.

While it is true this tutorial should have been updated long ago, it's not the main topic and with lazer in development writing a new one is pointless since most of today's elements might no longer work like they do now in the lazer client.
h3oCharles

Haskorion wrote:

While it is true this tutorial should have been updated long ago, it's not the main topic and with lazer in development writing a new one is pointless since most of today's elements might no longer work like they do now in the lazer client.

I'll let RockRoller know about this
EDIT1: He's working on it along with the wiki. I hope he gets Contributor badge for this
EDIT2: Yay 1000 posts!
Miwaa
Uuh Cool thanks mate
Acchu
Someone have the default skin?
s n a k e
all i want to do is take some parts of some skins i like and put them in other skins , why is everything so complicated .
Goompaolo95Beat
Spinerr-spin - Text that simply tells you to spin through spinner.


Correct spelling:spinner-spin
Death

Goompaolo95Beat wrote:

Spinerr-spin - Text that simply tells you to spin through spinner.


Correct spelling:spinner-spin
Fix'd
Ashuri-Chan
What is the name of the stars that come out of the sides when the song is going through a critical moment in the ctb? And the lights that come out when you dunk the fruit in the bar?
RockRoller
star2 is the stars
Not totally sure on the lights, but I dont think they are skinnable
Mathia
hi, i know that this may be a stupid question, but i can't seem to find a solution anywhere.

i'm creating a skin by making small changes to the Seouless used by shigetora on twitch and when trying to change the background of the spinner i cannot manage to fit the backgroung, which has an outer glow, with the spinner meter, that contains the image i want to show when spinning.

https://osu.ppy.sh/ss/11534383 <-- this is what i'm talking about

then i noticed that the images used in the original use different resolutions and the spinner metre is always cut by few pixel.

https://i.imgur.com/6Bqoyh7.png spinner bg
https://i.imgur.com/ErHRxqF.png spinner metre

i'm new to skinning but i hope you can help
saucegodd_old
how do i use a skin, it doenloads as a .osk file and i put it in osu skins and it doesnt work
RockRoller

saucegodd wrote:

how do i use a skin, it doenloads as a .osk file and i put it in osu skins and it doesnt work
Dont put it in your skin folder. You need to open it with osu
TG4X
Too sad that the Osu!Skins is going to close in 1st/January/2019 :(
NekoHaxor
How does one get the difficulty stars to work more as a bar instead of getting smaller? I find the scaled version very difficult to read, but when I change the version of the skin, nothing changes about the difficulty stars.
Matt2e2

NekoHaxor wrote:

How does one get the difficulty stars to work more as a bar instead of getting smaller? I find the scaled version very difficult to read, but when I change the version of the skin, nothing changes about the difficulty stars.

The version of skin.ini must be 2.1 or lower.
show more
Please sign in to reply.

New reply