A list of my favorite websites, tools, and ideas to help you with your next design project. A list of my favorite websites, tools, and ideas to help you with your next design project. If you’re a designer, if you’re a web designer, you’re going to get heaps of inspiration from these resources. I’ve put together some of my favorite graphic design tools that you should bookmark, whether you need a quick mood board, a new landing page, or just fresh ideas for your projects. Bento Grids My first one I love is Bento Grids. Now, you’ve seen the trend, everyone’s been doing Bento grids. It’s just a great way to show your brand identities or web design in a succinct manner. You can put it on social media, Instagram, or LinkedIn. It’s got a bunch of Bento grids that you can use for inspiration. The layout is easy; you can see everything at a glance, click on it, and then click on “visit the source” to go directly to the design. I love the animated ones too, they look really cool and are perfect if you’re working on a landing page or designing content for social media. Pattern Club Next up is Pattern Club. If you’re struggling to come up with a pattern design for a mood board or a client project, this is the place to be. It’s a curated site of all different types of patterns, futuristic grids, grunge, glitch, more retro vintage styles — all in one spot. It’s a limited service at $9 per month, but it’s worth it when you need a quick burst of inspiration. Uncut Fonts Now these fonts are all completely free. Uncut WTF is a great site, it’s got over 100 fonts, and you can scroll through different categories like sans serif, serif, monospace, and display. When you click on a font, you can see its license details (open font license) that let you use it for commercial projects, modify it, and even redistribute it. Just click “info” or “download” and head to the source, whether it’s GitHub or another site. Use & Modify Another site you can check for fonts is Us Modify. The site’s simple: a search bar, the option to switch to dark or light mode, and you type in a word (like “hello”) to see that text displayed in various fonts. Click the link on the left-hand side, and it takes you to the font download. Colllectttivo Colllectttivo Doit is another open-source font foundry with a selection of different fonts available completely free. If you’re looking for something a bit more out of the ordinary, you can click on the “typefaces” section and browse through some fun, high-quality fonts. Rebrand Need some Rebrand, Do Gallery inspiration? This site is updated with modern visual inspirations and rebranding case studies. It’s perfect for when you’re looking for new identity designs. If you click on one of the examples, you might even see a little video, and you can explore the case study and even visit the website of the company that was rebranded. FolioInspo Struggling with your portfolio? Check out FolioInspo if you’re creating or updating your designs. It’s packed with portfolios from various artists, creatives, and designers. Click on one, open it up, and then explore how they’ve linked their projects and designs. It’s a brilliant way to see different styles, typography, imagery, and overall design presentation. Snapshift For those who love AI or need images for website design, Snapshift is a great resource. It’s updated regularly with fashion-based, portrait, and experimental images. Just click “copy prompt,” jump into Midjourney or another AI tool, paste the prompt, and watch it load up. Lummi AI Another fantastic AI site is Lummi AI. They even have a Figma plugin. It offers free, high-quality images that don’t even look like AI-generated stock — they look like real stock images. Plus, it shows you the colors and gives you categories and tags, which is amazing for matching up your design elements. Iconoir For icons, Iconoir is a really great resource. It’s loaded with thousands of free icons. You can copy the SVG or download it, adjust the size, and play around with different styles. It’s a very clean, simple icon system. Streamline HQ Streamline HQ is another amazing site. It features custom illustrations, abstract shapes, and even emojis. Besides icons and illustrations, it also has freebies for icons if you want to experiment. It’s definitely one of those sites I was using the other week and really loved for its variety. Shots If you need mockups for presenting a brand identity, Shots is where you need to go. Just drag and drop an image, change the angles, and select preset layouts for devices like phones, desktops, or even wearables. It automatically generates a ready-to-download mockup so you can quickly show your work in Illustrator or Figma. LS Graphics LS Graphics is another perfect site for mockups. It’s a premium subscription or individual packs that you can buy. The mockups are great for animated designs, print mockups, apparel, textures like tape, and abstractions. Plus, there’s a section for free mockups too, curated with high-quality options. Design Gradients For creating fun background gradients, Free Gradient does exactly that. Simply click on the gradient you like, copy the hex codes, and use it for your design projects. UI Colors: Tailwind Tailwind UI Colors, also known as UIC Colors (uicolors.app), is a Tailwind CSS color generator. Just click the color, adjust it for electric green or neon green, and see all the monochromatic tints — from 50 up to 950. You even get examples of how the color looks on social media posts or UI elements like hover and active states. Curated Design Curated Design is a website that has a bunch of different design websites and inspirations. Whether you’re after portfolio ideas or AI inspiration, it will show you a variety of sites simply by clicking through. It’s simple with a clear menu on the left to filter all the options. Durves If you need to generate a custom dot pattern, Durves is a fun tool. Adjust the proportion of the dots, change the size, play with the dot radius, thickness, amplitude (which gives a wave pattern), and frequency. When you’re happy with the design, click “SVG” or “download PNG” and get your pattern ready to use on a mood board or design project. Flectofy: Shape Builder Finally, there’s Shape Builder from Flecto. This tool lets you create custom shapes or patterns for your background or design elements. You adjust the width and height, see the changes immediately, and then save it as PNG or SVG. It’s simple, intuitive, and a lot of fun if you want to experiment with your design layouts. I hope you find these resources helpful. Let me know if you want me to cover another topic, like AI resources or more web design resources. Got a favorite tool from the list? Drop it in the comments, I’d love to hear from you!

This story will praise and/or roast a product, company, service, game, or anything else people like to review on the Internet.

Walkthroughs, tutorials, guides, and tips. This story will teach you how to do something new or how to do something better.

My 10+ Favorite UI & Web Design Resources That You Should Bookmark

About Author

Comments

TOPICS

THIS ARTICLE WAS FEATURED IN

Related Stories

Untitled Story

11 Overlooked HTML Tags That Can Make Your Pages Pop

11 Overlooked HTML Tags That Can Make Your Pages Pop

What I’d Buy If I Could Only Invest $1,000 in Crypto

Memory, Calldata, and Storage in Solidity: Understanding the Differences

21 Best Mobile App Mockup Design Resources in 2018

11 Overlooked HTML Tags That Can Make Your Pages Pop

11 Overlooked HTML Tags That Can Make Your Pages Pop

What I’d Buy If I Could Only Invest $1,000 in Crypto

Memory, Calldata, and Storage in Solidity: Understanding the Differences

21 Best Mobile App Mockup Design Resources in 2018

Light-Mode

Classic

Newspaper

Dark-Mode

Neon Noir

Minty

HN StartUps