HOME | DD

steffne — Pixel icon tutorial

Published: 2010-08-26 00:56:22 +0000 UTC; Views: 52934; Favourites: 2568; Downloads: 503
Redirect to original
Description My very first icon tutorial!

Here's the end result:


Sorry for any typos etc. It's pretty late here and I'm tired

PLEASE NOTE: This is just a pixelling tutorial. You'll have to look into animation tutorials via Google. This also applies to making backgrounds transparent as it varies with every software and some don't support either of these features.
Related content
Comments: 291

polka-dork In reply to ??? [2011-07-17 03:36:19 +0000 UTC]

Yay! I made my own cupcake and lollipop! thank you!! (cupcake as my icon)

👍: 0 ⏩: 0

ColorBoom In reply to ??? [2011-07-16 22:39:05 +0000 UTC]

<- first try
Thank you It helped me alot ^__^

👍: 0 ⏩: 0

danibabyrox14 In reply to ??? [2011-07-15 19:35:54 +0000 UTC]

THANKS!!! this really helped me alot.

👍: 0 ⏩: 1

steffne In reply to danibabyrox14 [2011-07-16 09:54:05 +0000 UTC]

Aww that makes me so happy! <33

👍: 0 ⏩: 0

lisajong2 In reply to ??? [2011-07-15 09:50:41 +0000 UTC]

i finished my icon thanks to your tutorial here is the final result: [link]

👍: 0 ⏩: 0

xxxKawaiiCupcak3xxx In reply to ??? [2011-07-14 22:38:50 +0000 UTC]

<=== thsi is my first pixel animation~ i didnt know about the 3 line thingie TT_TT o well~ I really like ur animations!

👍: 0 ⏩: 1

steffne In reply to xxxKawaiiCupcak3xxx [2011-07-14 22:48:56 +0000 UTC]

Aw it's pretty good for a first go
I definitely advise giving the 3 pixels thingy a go next time,
it's amazing what wonders it can do for your work n__n

Keep up the good work

👍: 0 ⏩: 1

xxxKawaiiCupcak3xxx In reply to steffne [2011-07-14 22:54:02 +0000 UTC]

Thanks a bunch! I'll be sure to try next time~ OwO

👍: 0 ⏩: 0

takopax In reply to ??? [2011-07-13 15:55:44 +0000 UTC]

I think I'm gonna use your tutorial, I hope it will help me because it will be my first time and your step-by-step seems so easy 8D

👍: 0 ⏩: 0

Paintbrushy [2011-07-12 20:34:06 +0000 UTC]

I made my first pixel ever with your tutorial!

Link : [link]

Tell me what you think, and thanks!
Advice is welcome! ^^ <3

👍: 0 ⏩: 1

steffne In reply to Paintbrushy [2011-07-12 20:43:49 +0000 UTC]

Oh wow! That's reallyyyy good for a first try!
You've really grasped the concept of clean lines well, most newbies struggle with that including myself D:
You should keep it up, you seem to have a natural knack for it!

👍: 0 ⏩: 1

Paintbrushy In reply to steffne [2011-07-12 21:05:51 +0000 UTC]

Wow, it really means a lot to me to hear you say that! ^///^
I enjoyed it a lot, to make it I'll keep making lots more!! it's fun^^
Thanks again lots!!! <3

👍: 0 ⏩: 0

xXHappyRainbowXx In reply to ??? [2011-07-12 02:59:05 +0000 UTC]

Nevermind, but where's the coloring tool? I can't find ANY colors!

👍: 0 ⏩: 0

xXHappyRainbowXx [2011-07-12 02:35:02 +0000 UTC]

Cute tutorial!! Do you know where I could download Photoshop? And if it's free? Thanks a bunch.

👍: 0 ⏩: 0

Apinoru-chan [2011-07-05 12:16:12 +0000 UTC]

lol cute!~ how do u make sprites?

👍: 0 ⏩: 0

Masashiko-san [2011-07-05 08:19:34 +0000 UTC]

wht prgram? can u give me the link of wht program u used?

👍: 0 ⏩: 0

Wolfcubzelda In reply to ??? [2011-07-01 15:00:12 +0000 UTC]

This tutorial's really helped~! I'll go give your technique a try out! I've only just started pixeling,and this is the first tutorial I've came and had a look at X3 It make's pleanty of sence! I havn't actually heard of "pillow shading" before,untill now I'm extreamley guilty for leaving the outline black though
Thank you for making this tutorial~
The little frothy cup look's so cute :3

👍: 0 ⏩: 0

KamiTsuneko In reply to ??? [2011-07-01 03:35:44 +0000 UTC]

thanks for the tutorial >w<

👍: 0 ⏩: 0

cod8e In reply to ??? [2011-06-25 00:07:30 +0000 UTC]

rrrrrrgh no matter how hard i try i cant do anything better!

👍: 0 ⏩: 0

CandyCoatedPlanet In reply to ??? [2011-06-24 18:06:58 +0000 UTC]

what program did you use?

👍: 0 ⏩: 0

HasagashineKuroi In reply to ??? [2011-06-22 17:47:19 +0000 UTC]

K-kawaii!

👍: 0 ⏩: 0

MusicalCombusken [2011-06-21 16:34:33 +0000 UTC]

Very cute tutorial, and it helps. (I've done pixel art before, and this is pretty cute and easy to follow!)

👍: 0 ⏩: 0

MusicalCombusken In reply to ??? [2011-06-21 16:34:32 +0000 UTC]

Very cute tutorial, and it helps. (I've done pixel art before, and this is pretty cute and easy to follow!)

👍: 0 ⏩: 0

Iniful In reply to ??? [2011-06-21 10:42:14 +0000 UTC]

amazing tut this is soo helping mee!

👍: 0 ⏩: 0

Tala-Grey In reply to ??? [2011-06-20 12:14:32 +0000 UTC]

Thanks for the tut~ It helped make my current icon!

👍: 0 ⏩: 0

MikiCHU7 In reply to ??? [2011-06-18 04:53:12 +0000 UTC]

I use pillow shading a lot. -_-; But now I know not to do that because it looks weird... ^-^

👍: 0 ⏩: 0

carissaraptor In reply to ??? [2011-05-29 02:25:32 +0000 UTC]

I never thought about adding subtle hints of other colors before! Very helpful.

👍: 0 ⏩: 0

tronoajax In reply to ??? [2011-05-28 18:20:41 +0000 UTC]

Wht program do u use?

👍: 0 ⏩: 0

Nihon-Cat In reply to ??? [2011-05-21 20:32:50 +0000 UTC]

Very good !
Help's a lot : D
But wich resolution do you use ?

👍: 0 ⏩: 1

steffne In reply to Nihon-Cat [2011-05-21 23:41:31 +0000 UTC]

For a DA icon you want to be using the size 50 x 50 pixels
and the resolution of 72 pixels per inch (anything you create for the web you should create at 72 pixels per inch)

👍: 0 ⏩: 1

Nihon-Cat In reply to steffne [2011-05-22 17:26:53 +0000 UTC]

Okay thank you very much : D
I forgot that DA need 50x50 so my first try is 141 x 141 XD

👍: 0 ⏩: 0

hetalia-is-sexy In reply to ??? [2011-05-15 00:47:46 +0000 UTC]

this helps a lot even though i still won't be able to do it cause i always mess up but i'm gonna try

👍: 0 ⏩: 0

shelldevil In reply to ??? [2011-05-11 02:04:59 +0000 UTC]

Hey there
This piece has been featured in this article
Shell

👍: 0 ⏩: 0

Meerkat484 In reply to ??? [2011-05-06 22:13:22 +0000 UTC]

I used this tutorial to make my new icon.. it was really helpful ^^

👍: 0 ⏩: 1

steffne In reply to Meerkat484 [2011-05-06 22:19:32 +0000 UTC]

Awww thanks for telling me! <33
It makes me so happy to know that I managed to help someone out,
I learnt pixel art solely through DA tutorials
and was hoping to make my own that didn't quite fill in a few gaps for me in others I'd read
Looking back now I realise I could've gone into a lot more depth XD *facepalm*

But seriously, Thanks!

👍: 0 ⏩: 1

Meerkat484 In reply to steffne [2011-05-06 22:23:30 +0000 UTC]

No problem!
And that's ok, it was good enough for me to understand.

👍: 0 ⏩: 0

xDarkAngelSommerx In reply to ??? [2011-05-02 15:08:06 +0000 UTC]

aww this will rlly help me with my icons ^^ i wasnt the best at pixel icons but they do look rlly good when finished :'D and this tut sud help me alot

great icon too instant fav ^^

👍: 0 ⏩: 1

steffne In reply to xDarkAngelSommerx [2011-05-03 15:09:27 +0000 UTC]

Awww thankyou! I hope it helps

👍: 0 ⏩: 1

xDarkAngelSommerx In reply to steffne [2011-05-04 17:46:19 +0000 UTC]

it has ^^ i will graddually get better at pixel icons ^^ thanks to this tutorial :'D

👍: 0 ⏩: 0

innocentcookicrime In reply to ??? [2011-04-30 15:29:41 +0000 UTC]

how do u make a moving pixel icon i have flash do i use that?

👍: 0 ⏩: 0

iMuffinLover In reply to ??? [2011-04-26 20:02:07 +0000 UTC]

Im sorry but, How do you change the outline colour to dakr blue and orange when you already made it black? owo

👍: 0 ⏩: 1

steffne In reply to iMuffinLover [2011-04-26 20:50:29 +0000 UTC]

Just colour over the old lines!
Aslong as your pencil tool is 100% non-transparent it will manage to colour over the old lines in one click ^^

👍: 0 ⏩: 1

iMuffinLover In reply to steffne [2011-04-26 21:44:45 +0000 UTC]

Thanks!

👍: 0 ⏩: 0

DarkFoxOmega In reply to ??? [2011-04-22 03:12:50 +0000 UTC]

I have a question . . .
How do you get the BG transparent?
When I save and upload the BG stays white

👍: 0 ⏩: 1

steffne In reply to DarkFoxOmega [2011-04-22 10:02:02 +0000 UTC]

I only know how to do it in Photoshop ^^
MS Paint doesn't have any transparency options,
although I believe some people have found websites where you can do that

👍: 0 ⏩: 1

DarkFoxOmega In reply to steffne [2011-04-22 21:05:06 +0000 UTC]

Oh okay, I've solved the problem. But Thanx

👍: 0 ⏩: 0

3greendogs In reply to ??? [2011-04-14 23:52:42 +0000 UTC]

nice tutorial, i look forward to trying it!

👍: 0 ⏩: 1

steffne In reply to 3greendogs [2011-04-17 22:45:30 +0000 UTC]

Aww thanks, glad you liked it!

👍: 0 ⏩: 0

cardcaptor-eternity In reply to ??? [2011-04-07 02:17:18 +0000 UTC]

hiiii ^_^ i made my first icon with your tutorial

[link]

👍: 0 ⏩: 1

steffne In reply to cardcaptor-eternity [2011-04-07 09:48:29 +0000 UTC]

Aww thankyou for using my tutorial <33 c:

👍: 0 ⏩: 1


<= Prev | | Next =>