Тёмный

Creating Color Schemes EASILY: The Tint/Shade Method 

DesignCourse
Подписаться 1,1 млн
Просмотров 56 тыс.
50% 1

Опубликовано:

 

26 сен 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 59   
@DesignCourse
@DesignCourse 3 года назад
Hey all, just a little PSA: On September 14th, the PRELAUNCH of designcourse.com is here! Make sure to enter your email to be notified. I will also upload a video on the day of. It's been a year in the making!
@bosscoding3999
@bosscoding3999 3 года назад
finally, we could get those normal videos
@GraveRave
@GraveRave 3 года назад
Hell yeah!
@zalodias123
@zalodias123 3 года назад
Would love to have seen a more systematic, mathematical approach to this, based on color theory. Still great video though!
@mrnickb
@mrnickb 2 года назад
Yeah agreed, and this would probably be a pain in the ass to implement - this one screen shown in the video alone has like 8 different hex codes, imagine that throughout an entire app or website. A basic but easy way to create shades is start off with your "base" colour, place a black fill on top of it, then reduce the opacity of the black fill down to 10%, then do this again at 20% and so on. Each time you do this it will create a new shade, gradually getting darker each time. You can also do this with white to create tints. Another way to do this is to take your base colour, change the colour palette tool on Figma from Hex to HSB, and play around with the saturation and brightness levels. For example my base colour might have a brightness of 60, then I'll reduce it to 55 and create a shade, reduce it again to 50 to create another shade etc
@MarketGuy84
@MarketGuy84 Год назад
I never knew about this technique before but I am happy you showed me how it's done. Thank you.
@Favoxhille
@Favoxhille 3 года назад
Save the first color palette in your color library, change the hue values of that library and you got yourself some quick variations.
@ilooklikeacatmeow7609
@ilooklikeacatmeow7609 2 года назад
​@Maryam Ashraf he meant that pick that color and switch mode from Hex to HSL or HSB, that change the H (hue) values of that particular color to get a variety of working colors. In my opinion, this technique doesn't always work but when it does, it works good!
@mdfasadik9843
@mdfasadik9843 3 года назад
Back to old school 🖤🤍 . Missed this vibe a lot!
@fadhilsaheer8877
@fadhilsaheer8877 3 года назад
me: sucks with every color I choose gary: creating a cool design with RED & PINK 😂
@tangik432
@tangik432 Год назад
Best video for me to boost my confidence
@dimitrisqq
@dimitrisqq 3 года назад
I agree with @Goncalo. Hopefully we get either on YT or in upcoming course a more scientific approach to Color Palette Creating lesson-s. There is an in-depth course by The Futur - Color for Creatives but would like to see it in a web design course. For now, the palette apps and these videos do just fine.
@taffeno
@taffeno 3 года назад
Thanks my guy. This is just what I wanted to know for a very long time😍😍😩
@shaderone07
@shaderone07 3 года назад
By the end of this year you are definitely gonna reach 1M!!!
@Trazynn
@Trazynn 3 года назад
Your thumbnails are quite dark, maybe they stand out against default RU-vid but they're easy to overlook in dark mode.
@DesignCourse
@DesignCourse 3 года назад
I'll look into it! Ty!
@ashwin372
@ashwin372 3 года назад
I use dark mode always
@DesignCourse
@DesignCourse 3 года назад
Next week's videos will have brighter thumbs!
@hannahallain
@hannahallain 3 года назад
Same - everything that can be dark mode, is
@solitario8993
@solitario8993 2 года назад
I also use dark mode . Haha
@anandshindey
@anandshindey 3 года назад
Thank you so much. Was at loggerheads with myself on getting colors right. At last I have one way of doing this.
@utkarshmandape7949
@utkarshmandape7949 3 года назад
Same here. I also use that technique
@DevMadeEasy
@DevMadeEasy 3 года назад
Hey DesignCourse. 😮 Wow, Loved it, 🌈colors are not an easy thing, so great content, as always!!! I just 💜loved it. Thanks for sharing it!🙏
@cryptolicious3738
@cryptolicious3738 3 года назад
awesome ! i needed this video
@thearaav6670
@thearaav6670 3 года назад
The fact is that you show me we don't need multiple color to make UI beautiful. Just use one color and adjust the Tint and tone make show that it has contrast enough that would make your UI perfect.
@christianachleitner9439
@christianachleitner9439 3 года назад
What is the shortcode to directly use the color picker?
@emanuelrouse7076
@emanuelrouse7076 3 года назад
Does your course go over creating the actual UI and layout? I will definitely check it out if it does. I’m pretty new to UI UX design and your vids are helping immensely.
@victory_lucky
@victory_lucky 3 года назад
yes it does
@BleedingDryTheHeart
@BleedingDryTheHeart 3 года назад
HAHAHAH the thumbnail is hilarious , well played xD
@tempprofile6715
@tempprofile6715 3 года назад
Great video. Much needed for the us backend devs. I used the Coolors website to select a color pattern for my website. Any thoughts on that?
@DesignCourse
@DesignCourse 3 года назад
I've done a video on that app awhile ago!
@tempprofile6715
@tempprofile6715 3 года назад
@@DesignCourse Awesome! I will check it out.
@radityakrisnhamurti1810
@radityakrisnhamurti1810 Год назад
Leaving my comment here for future reference
@erbhargavvyas
@erbhargavvyas 3 года назад
Hi, I liked the technic and the output but did not understand the process fully. Can you please make a part 2 of this where you explain the process in little detail pls.
@konghaith668
@konghaith668 3 года назад
I need your help, Is there any free method to convert XD file to figma file? plz answer
@dailymeow3283
@dailymeow3283 3 года назад
Omg where's Jon Frok & the boja, i like it
@SaifZiya
@SaifZiya 3 года назад
At Scrimba, you don't just watch videos. No no no!
@michaelandreuzza
@michaelandreuzza 3 года назад
Last time I saw one of your videos, your hair was almost not present,..all i see is hair. Keep it up Gary, always fun to see your videos. Have a great day :-)
@slavenDj
@slavenDj 3 года назад
7:48 You did not have to detach instance, there is section "selection colors", where you could change the color of the text much easier.
@twjr4547
@twjr4547 3 года назад
Hey Gary , Love your content. Wanted to ask, any tips for Mild Deutan color blindness, also known as deuteranomaly color blindness?
@mayankagarwal5071
@mayankagarwal5071 3 года назад
Awesome Awesome Stuff😅
@Stoobers
@Stoobers 3 года назад
I'm half way through the video, and hoping you're going to actually check all these colours for accessibility...
@jamesmasch9011
@jamesmasch9011 3 года назад
Love that you are using Adobe XD!!!
@DesignCourse
@DesignCourse 3 года назад
I'm not though. That's Figma. I use Figma for random stuff like animated presentations. I'm boycotting XD because they won't allow me to change the canvas background color.
@rudral
@rudral 3 года назад
16 boja spies are amoung us, those dislikes...
@aminkamrani2690
@aminkamrani2690 3 года назад
LOVE your content
@m4saurabh
@m4saurabh 3 года назад
where is Jon Fork, is he killed by the boja.
@monsieurm2904
@monsieurm2904 3 года назад
The noze
@DesignCourse
@DesignCourse 3 года назад
wat
@monsieurm2904
@monsieurm2904 3 года назад
@@DesignCourse you have a big expérience and I love watch your skill. Perhaps a mathematic method will better for me as junior designer.
@dineshvaghela5395
@dineshvaghela5395 3 года назад
Hi
@abismo_tv
@abismo_tv 3 года назад
Adobe XD let you change the canvas color...
@aaryan5179
@aaryan5179 3 года назад
where is Jon Frok??
@DesignCourse
@DesignCourse 3 года назад
He's going on vacation for awhile
@aaryan5179
@aaryan5179 3 года назад
@@DesignCourse ok dude✌
@neexur
@neexur 3 года назад
Why you screenshot it, you could have just copy it as png 😭
@Royalbeck99
@Royalbeck99 Год назад
I like your videos, but this video is misleading and may result in designs with too many shade variations to that can be consolidated into fewer options. Also might not be accessible to some color-blind users. This method is just not good. The best way is to create the pallet before implementing it in the design, and also better to check the contrast for accessibility. I really hope that for your paid content you to teach more then experiment.
@cariagallagher2365
@cariagallagher2365 3 года назад
ezw3e vun.fyi
Далее
Did I Find the BEST Color Tool for Web Designers?
9:49
Color Shades: Most of you are doing this WRONG!
8:47
🎙ПЕСНИ ВЖИВУЮ от КВАШЕНОЙ
3:05:21
Офицер, я всё объясню
01:00
Просмотров 1,6 млн
How I make UI color palettes
8:51
Просмотров 414 тыс.
Creating Monochromatic Color Schemes - UI/UX
11:36
Просмотров 11 тыс.
60-30-10 Colors - Design Masterclass
8:15
Просмотров 62 тыс.
Color Crash Course for UI/UX Designers [By Example]
19:43
How I Organize Colors for a UI Design Project
8:50
Просмотров 182 тыс.
UI/UX Color Scheme Tutorial with Coolors.co
17:00
Просмотров 14 тыс.
Creating a Color System in Figma | 3 Easy Methods
16:02