Pixel Art Class - Palettes & Colour

[@ricniclas]

Why can't the day have 72 hours? I want to make games, learn how to compose, learn how draw pixel art, and I need to spend 60% of my awaken time at work T_T Incredible video, by the way

[@mannb1023]

seriously

[@paulbenedictjabines2261]

this!

[@gsinkus]

Great video, I've summarized it in a few steps and figured out palette for my game this way: 1. Pick a color you like (green for context, can use pictures for reference) 2. Desaturate until it fits the mood of the game 3. Create a ramp (paint on a canvas) where lighter shades shift towards yellow, darker ones towards blue. Leave the saturation for now, only adjust hue and brightness levels 4. Reiterate until it looks good. Remove/merge shades until you have as small as possible palette 5. Sature upper/middle shades of the ramp (if needed), desaturate hihglights and shadows for more blend between other hues 6. Pick the next color accoring to context (ex. fit green grass to blue sky), repeat previous steps for it 7. After you pick most of your hues, adjust whole palette's H, S, B, curves if needed, but don't go overboard here Good luck!

[@thegreatestdao]

This is a very intelligent summary!

[@YummYuuu]

Perfect Summary!!

[@andrewferguson6901]

for posterity: the program used here is aseprite

[@catherineoborski2283]

This is literally one of the most valuable resources on color theory I have ever seen. This is really valuable even if you aren't interested in pixel art specifically.

[@taybearfedele869]

THIS THIS THIS THIS THIS

[@diegopiedra4170]

I completely agree

[@themelancholyofgay3543]

color theory is omnipresent

[@jackskydragon_JW]

I agree. I already have seen a lot of many different ways of explaining the colour thoery but this one is definitely one of the best ways of explaining it.

[@MikeScottAnimation]

EPIC VID man. As a colourblind pixel artist, I finally kind of am starting to understand things. You explained it so well with fiddling with the relationships with the colours and the curve. I learned a bunch, thanks.

[@rfMokou]

Wow! I was there during the livestream and it sure didn't feel like 40 minutes at all (or more, thanks video editing). It was such a nice topic, even if most of those things weren't new for me. You're doing an amazing job with all your videos :) Thanks

[@loot6]

This is the best video I've seen so far on colour theory with pixel art. I haven't come across this where you show colours have relationships in the palette beyond the obvious.

[@DDCRExposed]

Wow, watching the example of creating the palette/ramp from scratch really helped me understand the hue shifts and such. Understanding the shifts to yellow and blue/purple from other videos. Seeing that angled shift in the color picker was SO helpful as well.

[@TheKrensada]

This one video taught me more about color palettes than I have learned in 30 years. I'm absolutely floored.

[@hottdogge1749]

this is actually a very useful video! i’ve been struggling with colours when it comes to making pixel art for my game. i’ve realised that my drawings are usually very muddy because the colours don’t fit together. this was a really good explaination of how colours in pixel art work. thanks for this!

[@Ric_93]

Absolutely great content! I'm learning how to do pixel art myself and I've learnt a ton from your video!!

[@yusrighouse]

Hey Ric! nice to see you here. Adam is like my go to guy for pixel art stuff. Its like a master class haha.

[@lucienmontandon8003]

Couldnt agree more

[@diamondmind-fg6md]

@@lucienmontandon8003 x2

[@wilsonlee6384]

wow!Ric!...👍💯

[@andreicostea5088]

Damn bro, Ric said this 1 year ago and now he posts videos on how to make money with pixel art. Respect the hustle!!!

[@BeingFriends]

This is beyond helpful! I have never had the confidence to draw or do pixel art and I feel like I am learning so much from your channel!

[@EasyCartoonDrawingTutorials]

This is a really good lesson, not just for pixel art, but for visual art in general.

[@simpson6700]

aseprite is amazing. you blew my mind when you changed the color pallete and your canvas colors changed accordingly and when you used the hue slider on the pallete.

[@gavinboyer4634]

I think the single coolest pallette I've ever seen, was one where the artist did everything in black in white, the darkest bits were straight black and the brightest bits were purely white, but all the grey areas were coloured with. . . well, colours. It was a single ramp that went white to bright yellow to medium orange to medium red to dark purple to black, and the artist used this to create a monochrome effect.

[@kiaru86]

Hi, this vid was like 2 years ago so I dont know how the Aseprite tools and options were then. I recently discover an easier way to make a linear gradient in the palette. 1- leave empty as many color cells as you need, lets say 8 for example 2- sellect the first cell nº1 and choose a color for it, like dark blue 3- sellect the last cell nº8 and choose another color, like light green 4- sellect all the cells from nº1 to nº8 wich also includes the black empty ones between the two colors 5- go to "Sort and Gradients" in the palette menu, then sellect the "Gradient" option You will see how the gradient generates automatically. Its a linnear gradient so, if you need those colour bridges between gradients it has to be edited. But I found it very usefull way.

[@milanstevic8424]

The reason why shifting into warm/cold hues works in the mind is called Rayleigh scattering. Naturally, the sky appears blue due to this effect where all wavelengths longer than blue get culled while traversing through the Earth's nitrogen-filled atmosphere. Why is this important? Well, because there is an interesting effect the daytime sky produces, known as atmospheric light. If you're observing something that is directly lit by the Sun, it's washed by white light (yes, Sun light is bright white for all practical and physical purposes), but any shadow will be indirectly illuminated by atmospheric scattering, changing its hue to blue. This will give rise to a perception that the lit areas are slightly yellow (this is how contrast appears naturally, through complementary colors, and never through brightness alone). Obviously if you don't want a sunlit summer mood in your art, you need to tone down the effect the scattering has and introduce less vibrant colors. But this is why bright colors like to appear warmer, and shadowy ones play well with the cold tones. Also psychologically, darker places are normally lit by weak sources of light, at least compared to Sun, and humans can't exactly tell two dark hues apart, because of the massive lack of photons needed (literally information) in our sensory cells. Therefore, dark colors should be desaturated. In general, too dark and too bright colors are essentially the extremes, and are used only to frame the dominant part of the visible spectrum, which is a dynamic thing and human eyes can adapt to a continuum of brightness (though moving from too-dark to too-bright areas can even hurt or damage the eyes), so the relative saturation works wonders with the mid-range colors, and this is where the optical variety should lie. Hopefully this explains the 'palette tricks' from the physical standpoint.

[@dorzaii]

You're the best pixel art teacher that I've found! Your tutorials are amazing and made me improve so much in little time!

[@ofirsm]

This is the first time anybody explained color to me in a simple and understandable way. Thank you!!

[@ScilexGuitar]

Imo the most important thing is value, if the values are right you can get away with anything hue/saturation. The most important thing tho is that the choices are intentional

[@vinly4458]

You posted at he best time! I've been looking into palettes all day today! Thanks for another great upload!!

[@overbyte]

Great explanation. Thanks Adam

[@Akari_A_]

Hi there, I found your videos when searching for pixel art tutorials and/or guides, and let me say they are straightforward and overall easy to understand. Thanks for putting these up.

[@saaqib_0252]

You don't know how thankful i am for this thank you for making this video you are amazing

[@Ric_93]

Oh hey Saaqib!

[@saaqib_0252]

@@Ric_93 Hey Ric

[@deepennyway3844]

The idea of moving toward blue and desaturation as the color darkens makes sense with what I’ve been told about how colors in the physical world shift toward greys and blues when there’s less light (like at night)

[@Auhn]

As someone who's tried to learn color theory for the purpose of making art in games, this finally makes sense to me.

[@BulletDarkness]

This is really great content, never thought of the palettes this way.

[@Tavor57]

Fucking phenomenal! I imagine the "brighter going towards yellow" is one of those things that just feels right, and probably has roots in brightness being associated with yellow light. If you're going for a colder palette it might be interesting to see the result of instead going towards blue. Either way this has taught me an incredible amount of stuff about pixel art that I was just never able to get right, and now I know why. I found one of your videos on tilemaps the other day and you're quickly becoming one of my absolute favorite game dev content creators! Looking forward to watching the rest of your stuff. :D

[@sosasees]

for me it works best to not choose saturation first and then hue and lightness at once. i first make a greyscale pallet so that i know what steps of lightness i want. 𝘵𝘩𝘦𝘯 i choose hue and saturation. ※ a greyscale pallet has 𝘯𝘰 𝘴𝘢𝘵𝘶𝘳𝘢𝘵𝘪𝘰𝘯, so all hues look the same. all greyscale pallets are monochromatic, but not all monochromatic pallets are greyscale.

[@mrcleglaw256]

mad good stuff, after years i finally feel i understand it now. your examples were really helpful too.

[@Ric_93]

I LOVE your channel, great content, you deserve more man!

[@JeanVermeersch]

You should shared his channel on yours, that'll help him I guess :D

[@nashionalcookie]

I LOVE YOUR STUFF! It’s SUPER informative and engaging, and also entertaining! I’ve learned so much!

[@BlueNip]

Where is that saturation bar on aseprite? All i have is the grid looking one.

[@MeatsKilla]

You're a really good teacher! You give the "how" someone who start need.

[@madmanmax120]

This was super useful! I was thinking with all the curves, do you think there's some sort of "maths curve equation" which you could use to plot which colours you might want to use? Or is it more touchy-feely than that?

[@AdamCYounis]

I think everything can be described as an equation, but the question of "what you want to describe" will always come down to design / aesthetics. The key takeaway is that if you follow some functional distribution or equation, your eyes can recognise visual flow created by the algorithm.

[@decrodedart2688]

Yeah there are some fairly basic conventions that are good to know about. Then there are the more complex techniques. Beyond that it gets insanely complex with maybe limitless possibilities and combinations of effects that can play off each other. This is because the human mind is immeasurably complex and we enter realms of perception psychology. It probably helps to understand a bit about these concepts for example which are all at play at the same time: 1) Gamut mapping 2) Mood lighting 3) Local and global colour If ur interested to gain a better foundation you’ll get a lot of good info from “colour grading” for film which is basically LUT. This covers i guess the “surface” level stuff; what effects can be applied to a whole image. The other side of it is how materials react to light. For this it really helps to understand the concepts (not the math lol) of Fresnel equations, something I’d encourage you to read up on, observe as u walk around outside (atmosphere, water, leaves on trees, gem cuts etc etc) and also revisit this every once in a while for fresh insights. Once you grasp this foundation, it makes a lot of sense how PBR materials work. Playing around with PBR is a great way to get some practical in depth knowledge u can apply to painting with pixels 😊

[@jaredjones6570]

Mathematics, the practice, is an artform of its own. It does not have the harsh rigidity that everyone assumes after having exposure to the basics of arithmetic and algebra. I'm about to graduate with a bachelors in mathematics. The deeper I've delved into mathematics, the more I've come to appreciate the artists' perspective.

[@redpepper74]

@@jaredjones6570Yeah you get to be a lot more exploratory and creative than people think. What tools should I use to get from point A to B? Is there a relationship between matrices and groups? Can I find any interesting edge cases? Etc.

[@gamerp1g]

I just started making pixel rt recently and your videos are so extremely helpful. I have never done any kind of visual art before so all of the stuff you are teaching us here is so new to me. I watched your lighting and shading video yesterday and it totally changed (IMPROVED) something I was working on!

[@An_Icon_Living]

This video, like all your videos, will continually grow in views forever. Great content man, I can tell you have a general framework for your explanations but work through the topics in real time which sometimes allows you to have epiphanies while teaching. By far the best teaching method I've both used and learned from. I just got into pixel art the other day and I'm literally flying through the learning process because of your videos. Hopefully I make a lot of money because I will most certainly come back to pay my respects.

[@fatalityfx9571]

"if your eyes are telling you it's looks allright, thats good enough, right?" Sir... I'm colorblind...

[@guyarmando5046]

thank you for this aseprite tuto Adam it help me so much, cuz I was searching the index mode for my color palette 5:50 to apply the no dithering option you help me so much, good job!!

[@lullaby445]

22:35 The math is called Lambertian shading. I recently came across a video on Proko which explains how this principle affects value. So perhaps when we find a color ramp pleasing, we're actually reacting to the value each color represents. I'm currently implementing this concept into my color ramps by soft proofing my document to grayscale and trying to match the values as closely as possible to the Lambertian value curve. It seems to be working so far. Also, I realize I'm very late to the party, but I thought I'd comment anyway. lol

[@DrWolves]

I just got interested in pixel art. Never done it before (my friends were really into it though), but I have to say - watching your videos makes me so excited. Your guidance and explanations are so well spoken and easy to follow and understand. I efing love your channel. Subbed immediately. Your fantastic. Keep it up!

[@doctorzoidberg3000]

Awesome video. Thank you very much!

[@gatosandrea]

This made me realize my palette was not good and I am thankful for it :)

[@gnerkus]

Same here. I made a palette that failed horribly when I tried to paint a character in 32 x 64.

[@trustygecko3519]

Holy shit...Color Theory actually makes sense to me now! Thanks so much for this man You're a legend sir

[@issacthompson330]

the curve he described at about 22:50 is basically y=a^-x and that gives so much insight as a mathematical person.

[@TheEnobis]

I didn't know that I was using your Apollo palette for my project the whole time 😅 now that I know how it was created I'll try changing them or even creating my own palette for my game 🙏

[@BraveSirSausage]

amazing video playlist - just a quick thought about monitor calibration before starting anything like this, do you need to do anything?

[@sosasees]

you should discuss OKLCH color picker sometime because even with all the knowledge of color (that i could reasonably have) i could not pick great colors before i used OKLCH color picker. the color pallets that i picked in HSL were always uneven, and it is wayy too tedious for me to correct them (so i used other people's pallets 𝘰𝘯𝘭𝘺 before i found OKLCH color picker). but in OKLCH i can just pick a new color and be sure that the same mathematical transformation - for example removing 16.67 lightness and 0.0083 s̶a̶t̶u̶r̶a̶t̶i̶o̶n̶ chroma - always results in the same difference.

[@r4yZorTV]

11:18 is exact my first Paint as i tried to make a Landscape xD ur videos are by far the best explanations i could find out in the void of youtube^^....great stuff....explanation are so detailed...it helped a lot thanks!

[@alexatedw]

Great content! Just getting into pixel art and this was an excellent explanation of how to create a palette!

[@decrodedart2688]

Cool vid. Its also helpful to make use of the Gradient option inside the palette sorting menu.

[@pvrhye]

In university design glass we did this thing where we had white and black gouche and had to paint 11 distinct evenly distributed values. 11 is flippin hard to differentiate, so I think that kind of sets the upper limit for the practical number of values that might be valuable.

[@axserwz5022]

I'm gonna watch your stream, cause apart from this awesome, helpful content, I just love watching your videos

[@brianwilson7497]

uuuuhhhnnnggg fantastic thanks for the knowledge, exactly what I was hoping to find

[@ak_oneoneone]

As always Adam, veryy good content, keep up the good work!

[@vilzio89]

You are first

[@MrKingJavo]

Amazing video! Really thorough explanation. You’re the best!

[@simpson6700]

your color pallete looks so pleasing, i was sure there was some kind of math behind it.

[@awoolensleevelet]

this is really helpful, thank you so much!

[@TheAncientLich]

Our eyes perception of brighness vs real brightness is indeed not a linear curve. You are more confronted to that topic in photography, video, and of course 3d. In a way this was exploited by sRGB to encode in analogous or 8 bit digital signals a broader perceptual range. Look up srgb, hdr, lux, light stops, for more litterature. Disclaimer that I am familiar to the subject, but no expert by any extent, just an attempt I confirming your intuition at the beginning of the video when you played around with that green gradient :)

[@gonzalogarciaarino4209]

Exelent video I'm a indie Game dev and I also have to do the pixel art for my game. Something with I struggle the most is for making the palette. And I have trouble making the enemies pop up for the tileset background. What you suggest? Using a different saturation? Using another palette? What I'm doing now is using a shadow shader to cast shadows on live objects but I don't know if a just have to remake my color palette. Thanks for the video!!!

[@edgarbourdier8672]

Maybe to make them pop out use a different saturation, so low saturation for backgrounds and high saturation for player and enemies, of course you’ll run into the problem of if your game is not supposed to look like nintendo color fun it might not fit so you’re probably going to need to get the saturation of both down while keeping a significant gap between the two. That along with a black outline around your characters and no black for the background should make them pop.

[@UODZU-P]

Me trying to hue-shift a blue to feel colder - greens to the left of me and reds to the right. Stuck in the middle with blue.

[@sergioalejandroartunduagab3837]

Something interesting is the peak of dark colors formed on the blue area. I don't know if that's related to the use of blue for shading purposes. In the red area we can see another peak of dark colors, so I supose red can be as well used for shading. The opposite is with yellow and cyan, maybe used for lightening. Or could be that I'm completely wrong, hahaha

[@hulkito852]

thanks for sharing helped me out a ton to come up with some colors that will reflect my artistic perspective

[@259celcius4]

You have inspired me to make a game XD

[@gagne6928]

Im pretty sure you can also use the scroll wheel to adjust saturation when your mouse is on the color spectrum... I use it to adjust hue easily in my art because i use the color spectrum with the hue slider on the bottom

[@petramala7683]

yup, our eyes see differences in colors (darkes shades) logarithmicaly. its possible to see at some mathematicaly wrote experiments including vision (changes and rection)

[@tomaslehuedediaz7396]

Great youtuber and streamer

[@CrisisBomberman]

This is great, i didnt know the index technique ty

[@LuanaSantos-rl4sb]

tks Adam, learning a lot from you

[@highenough18]

thank you so much for this great video. i learned a lot!

[@muminavan]

really helpful video, excellent content but agree with others the music was a littl distracting. your voice and explanations are excellent, but maybe choose a more chilled background music . thank you so much for the tips, i can now make my own palettes

[@brayden-ewen]

Thank you for posting these!

[@xpert9001]

How many colors do you usually put in a palette? it looks like about 50. Is there a specific reason its about that?

[@AdamCYounis]

The palette I use is one I came up with as a general purpose palette for games, so I use it for all kinds of things across multiple projects. But if we wanted to design a palette for a single image, we could go for as few colours as you like.

[@candygonemad]

30:00 yep desaturated colors are able to bridge the gap between hues well

[@xDJKerox]

Hey! How do you make the color picker look like that? I just bought aseprite and it's based around hue instead of saturation :(

[@xDJKerox]

I found the method it's on the options tab at the palette window (Color Spectrum mode)

[@lightninjohn5651]

@@xDJKerox thank you so much, I also couldn’t figure it out

[@kvasir501]

pretty chill video

[@FPNader]

loving your videos, specially this one. thanks

[@kokochono5054]

I'd love to see a video on using the color pallete for environment and character. I.e. how to make the character stand out if ur using the same color palette for chatacter and environment. Can we make the chatavters more saturated? Lighter in value?

[@joellasoe3218]

Hi, I have a hard time making a palette since I'm colorblind. When I draw on paper I only use black and gray. Would having wrong colors make for an interesting style or would it just look weird?

[@AdamCYounis]

I have a friend who is colour blind who actually makes very interesting colours. I think it's hard to say, because other people won't see what you see, but I think something minimal would work well. mostly black and white, with a splash of a single colour would be simple enough and effective if used well.

[@ULTRADARKSETH]

Hi Adam. You shared your palette you use in Asprite in one of your posts or videos long time ago. Possible to share it again please? You have a good balance which I like.

[@Welteninsel_K]

Thanks a lot, this video helped me to make a decent palette on my own.

[@TheRunDNB]

Thanks for the video! It would be helpful to know how it is possible to see the change of color in the picture while editing the color on the spectrum?

[@AcnupuH4uk]

Hi. 20:25 how you change the color at the same time?

[@Lumaa_Lex]

Set color mode on new file to indexed

[@Zyugo]

In my case, I use the EGA/Master System palette for the graphics I'll be using for my project in Unity.

[@TheSensationalMr.Science]

when you had the green hue ramp it looked a lot like those paint cards at Walmart where they show different colors... maybe they do the same thing EDIT: 20:20 is where I see it Hope you have a great day & Safe Travels!

[@banish4cost]

When using a color palette should you make shading differences on your own using HSV with each color or use the colors provided as different shades, given its like a SNES palette with lots of colors not like a 4 color palette

[@Dentas137]

How do you set up your aseprite color picker to be the full spectrum?

[@nazeerdann497]

Really great video... I learned a lot about creating a palette... you made things easy for me to start making pixel art ... I have a problem in aseprite when editing a color it doesn't change on the canvas in real time ...is there an option for this?

[@Tyrull]

So, I guess this is to late for you, but I just got this problem, and was searching for an answer. What you have to do is go to: sprite menu -> color mode -> indexed. This basically means your canvas can only use the closest color in your palette, so when you modify it, it modifies the canvas.

[@nazeerdann497]

@@Tyrull thanks for your reply. I searched for an answer after I commented this and found it on reddit.

[@stefanimal5257]

Wow this was so good.

[@geshtu1760]

This was so helpful. Thank you!

[@kasfud9590]

I really love your videos. I recently started to learn pixel art and your content is gold, you explain everything so well and they are surely entertaining! And I learned even things that does not apply to just pixel art, which is amazing, I stury art major and it is very helpful. Can I ask you what program do you use for pixel art?

[@andrewferguson6901]

this program is called aseprite. since somehow, after 2 years, nobody put the name of it in any of the comments. here's to you future watchers!

[@MrMuicego]

YOU ARE GREAT

[@smokinZOMBi]

oh my! i saw that post ages ago, thanks for remind me its existance.

[@harshgandhi2030]

Hey... You created Arrowbound!!! Congratulations! It's a great game!!!

[@AdamCYounis]

That's right! Thank you

[@emanuelbellanti4308]

This guy is a best!

[@mvpixel_]

Amazing Video

[@Qaosbringer]

I don't understand two things. 4:53 How you created that spectrum, I tried a lot of times, no luck. 5:42 How you pasted that view without changing the palette on the right. I can't do these things and how much I struggle, it only stucks on unrelated stages. Pls Help.

[@funkenschlag5701]

That was really helpful. How would you create a palette with a very small amount of colours(like 4-8)? I'm a beginner and I want to really limit myself with the colours.

[@AdamCYounis]

With a very simple palette, you have a couple of options. You can use a single ramp with hue-shifted values across brightness (think a heat-map of dark blue to bright red, something to that effect) or you can try to pick from a selection of colours that have varying brightness, saturation and hue, such as the DB-8 palette. These are, in my opinion, probably harder because they require such decisiveness (like the one in the video with the knight riding a lion). As always, you can treat it like an experiment and just pick some colours, even at random, and adjust them toward something that works as you're applying them to your canvas.

[@funkenschlag5701]

@@AdamCYounis Thank you :)

[@SupraTimmix]

Thanks, this is a very helpful tutorial.

[@vila-gm]

Man amazing, thank you.

[@zhivkominchev4461]

Hey, great videos dude. Keep it up! I'm pretty new to Aseprite and i was wondering, how can i make the colors appear like that on your video ( the bottom left part of the app)? Sorry if it was already shown, i didn't see it :D

[@jonchun1784]

I know it's' late but I had to go hunting too so will respond for others to see. It's in the "Color Spectrum" option of the palette window. He does it at 4:52.