Best Web Design Resources 2024 Worth Bookmarking

here are some of the best web design resources worth bookmarking such as icons colors topography fonts courses first is reloom a really cool website that uses AI to generate wireframes it can create the entire mockup for a website just from a single prompt and this is an example of one I made in just under a minute in terms of picking colors design gradients is a great website viewable in both light and dark mode this website lets you see different types of gradients in combination with closely related colors however if you're looking for color combinations that you can use for a style guide of a website color Hunt is a great website that offers these with a nice filter selecting the colors you want these can be arranged by what's popular or even by tag if you're looking to animate elements inside your website Jitters is a great tool that lets you do this their onboarding experience was great and a testament to Showcase what you'll be able to do once you learn their system which essentially is an animating components and they've got some examples here then their editor inside of the browser actually lets you view and customize them or create your own Lotty files is another website very similar they also help you build animations for a website the files they produce which are animated can reduce a gif which is 300 kiloby down to a file that's only 6 kiloby there's also a library of pre-existing animations or you can always build your own with their custom editing software similar to the one from Jitters to find good-looking fonts font share is a website that lets you search and preview how text might look like on your website you'll be able to change the different size of your text but one of the features I like most is pairs which actually selects good pairings for fonts of headers as well as paragraphs as this is something I struggle to always do if there are too many choices font Joy is a website that reduces this by using a generator that automatically picks them for you all you really have to do is use their slider to select how similar or dissimilar each one of the fonts for the header and paragraph will be of course you can preview older fonts which is substantial but this is too much for me if you're looking to build web designs using AI maso is a pretty cool little website that allows you to do this right inside of figma using their tool that actually integrates with chat GPT after writing a prompt it starts to generate the website based on the context of that prompt but unlike reloom AI which just creates a wireframe this one creates a proper we it design then it's not that hard to turn it into a real website designers have access to lots of no code tools one which I found particularly good is Wick Studio mainly because it works very similar to figma but on top of that I can resize my viewport I can use the inspector on the rightand side or add elements to the page on the left hand side and quite literally just drag and drop them wherever I want in terms of illustrations humans is a website that allows you to mix and match different types of images of people and you can c customize your own images as well selecting what the hair or body or clothes look like these illustrations look perfect in apps or in different sections for web designs then on the website blush you can take these and customize them having them look however you want and exporting them as well like this YouTuber which I created with a transparent background the blush website actually has quite a few different types of illustrations you can use and customize or even search up open beeps is another handdrawn illustration library of people just like with you you can use a blush to customize the look of each one of these letting you mix and match different types of bodies faces expressions and much more or if you're lazy like me you can just select a shuffle to do this automatically for even more illustrations icons 8 is one of my favorite websites it has a huge library of assets even these handy 3D hands which I love this clay morphism effect that you can utilize for web designs you can download these assets to use in 3D software or even just as a PNG on the back back of a hero section the icons 8 website has a whole section called ouch which is full of illustrations not just these 3D hands but all sorts of 3D trending and Universal type illustrations these are beautifully designed and even animated giving life to a web design or even an icon that you otherwise wouldn't be able to get if you were trying to just do this yourself if you're looking for courses and Vado actually has a really cool and free starter guide on Graphics design as well well as all the essentials things like Photoshop After Effects illustrator and much more the courses come with both a video and written section that you can go through to learn about some of the fundamentals of how to design goodlooking Graphics another popular course is refactoring UI this is quite popular especially for designers are looking how to do user interfaces and components there's a lot in here on how to lay out and select colors for components in order for them to look visually more appealing if you want to go one step further the ultimate design bundle is quite comprehensive it has three main books in here one for learning figma one for the design manual and one for making web designs you'll learn how to do really good mobile and responsive design alongside learning how to do great web designs that would make a bit of money finally I have my own course design for developers or teach me Design This one is a more throwback to the fundamentals things that aren't often taught in a lot of these courses I talk about the history of color theory how to select good looking colors and work them in different combinations using things like the color wheel in addition to the course I've created a video for every single chapter in the book itself I've also designed the book to be beautiful so that every single page is interesting to read and Visually appealing here are some good YouTube channels to follow if you're learning web design saori Graphics is a great channel here by Citori which does a lot about Graphics design things like contrast which is one of the most fundamental elements to get right if you're trying to create any type of Graphics content Gary Simon runs a channel called design course it's one I've been following for years Gary Simon teaches all types of Concepts from creating logos to creating good color schemes and how to stay ahead in this changing world of web design another one I like is by Brad Hy here called the creative crew he goes into all things web design but also with a Twist by adding in no code if this wasn't enough for you and you want even more resources check out the best design resources of 2024 website by desmi I'm going to link in the description a lot of the examples here were reference from this website and was just the tip of the iceberg there's a huge collection of color inspiration design blogs design courses mockups icons illustrations design software fonts prototypes mockups wireframe software pattern generators free stock image sites project management freelance workplaces and other resources this is perfect for anyone looking for pretty much anything

Channel: Codex Community

Views: 141,286

Keywords: design resources, web design resources, website design resources, colors, illustrations, images, courses, channels, fonts, typography, best web design resources, Relume AI, Design Gradients, Color Hunt, Jitters, LottieFiles, Fontshare, Fontjoy, Musho, Wix Studio, Humaaans, Open Peeps, Icons8, envatotuts, Refactoring UI, Ultimate Design Bundle, Teach Me Design, Satori Graphics, Gary Simon, Creative Crew, Best Design Resources 2024, ui, ux, graphics design, web design, website design, website

Id: 7hgIzaifLN4

Length: 7min 2sec (422 seconds)

Published: Mon Mar 11 2024