iCodeThis

iCodeThis is a great resource for practicing your frontend skills, with a wide range of designs to replicate. But don't get too caught up in making a pixel-perfect replica - being creative is encouraged! To help you do just that, here's a list of resources from around the web.

Images

Unsplash

High-quality, open-source images for pretty much any project. To link to an image, right-click in your browser and select copy link. The last two parameters - w and q determine the width in pixels and quality of the image which is useful for adjusting to your use case.

Pexels

Another open source option. The image links allow you to choose the width and height of the image, as well as the color space if that matters to you.

Colors

Tailwind Colors

The Tailwind docs are generally excellent, and the section on colors is no exception! Even if you're not using Tailwind, you can still make use of the hand-curated set of colors Tailwind provides by simply clicking your desired color in the docs, which copies the hex code to your clipboard for pasting.

Huemint

There are many color scheme generator tools online, but Huemint is one of the best. Not only does it generate customizable color schemes, it also displays them in mockup websites (in various styles), illustrations, gradients, and more.

Dribbble

Dribbble is a resource with many uses for web devs, but one of the most useful and little-known tools is the ability to filter a search by color. Just enter a hex code and you'll get plenty of results showing your color in action - and also get some great, hand-picked color combinations too.