7 New Website Inspiration Tools

Over the last couple of months, I’ve found and kept 7 new website inspiration tools that I use pretty much every time I design a new website.

Some are more niche than offers, but I think anyone that typically reads my content could also benefit from them. If nothing else, they’re cool!

Read this on medium.com.

Starting strong, this website offers a free collection of over 5,000 community made UI elements. Ranging from button to checkboxes and everything in between!

It’s an awesome way to find design inspiration, make changes and then easily copy it over to your website. It’s also 100% free for personal and commercial use which is awesome to see, not many tools still have a free plan.

7 New Website Inspiration Tools - uiverse.io

You can create a free account to save designs for later but I prefer to just bookmark them as I have enough accounts as it is! Also, nothing worse than switching accounts and losing all your saved components.

You’ve probably already heard of Dribbble.com, which is why I put it in second place.

If you’re having a completely stunning design concept, then this is the right place for you. I find most designs very aesthetic but not very functional, so whenever I see something I like it often has to be changed quite a bit.

Please don’t just copy designs as well, take inspiration and made every website unique!

7 New Website Inspiration Tools - Dribbble

Just like uiverse.io, Dribbble is completely free to browse however their are Pro plans for creators and designers wanting more features and designs. Dribbble is also used by many designers to showcase their work and get hired too.

If you find a design you like, you can often reach out directly to the artist and hire them!

Similar to uiverse.com, Lordicon offers an amazing repository of 24,000 animated icons. The free plan has much less than this, but it’s still amazing for what they offer.

With 5,900 icons on the free plan and an additional 18,100 icons in the Pro plan I doubt you’ll run out of icons anytime soon.

7 New Website Inspiration Tools - Lordicon

So next time you’re creating a website and the icons feel a little flat and boring, using Lordicon to add some spice and really make your site pop!

You can also export the icons in a range of different formats, with the most common being a Lottie file which comes out as a JSON:

Lordicon - export options


Who Owns Microsoft?

Microsoft is one of the largest and most recognisable companies on the planet, operating in…

Read More

Quite cool that this tool runs entirely off GitHub pages, but aside from that it’s a nice simple tool that allows you to create custom border radius shapes.

With an easy graphical interface that exports the CSS require, it’s definitely one that should be on your list:

7 New Website Inspiration Tools - Fancy Border Radius

If you’ve ever tried to create a gradient on your website and found that it creates horrible banding artefacts between the colours, then you need to use this cool.

In short, it changes the gradients from linear to easing, something that is sorely missing from vanilla HTML and CSS.

You can use the graphical menu to design your gradient, and use the second CSS generated to implement it:

7 New Website Inspiration Tools - Easing gradients

The first CSS block is what the easing gradients should look like in CSS, and might do at some point in the future. But for now, we need to use the second CSS block.

This was created by Andreas Larsen who also have a number of other useful projects to check out.

Items is a huge collection of AI generated assets for websites and other creative projects.

with 350 free assets and a total of 904 assets as part of their paid plan.

7 New Website Inspiration Tools - Items.design

Such a super useful tool when you want to add some flare to your website. Rather than another stock image, you can use an eye-catching object instead.

Whilst the base ui.glass website is based around a modern CSS UI library based entirely around glass morphism. The tool I wanted to show today was their free glass morphism generator.

Whilst it can’t give you the HTML, the CSS is a goldmine for finding awesome looking component designs.

7 New Website Inspiration Tools - ui.glass

Glass morphism, at least for me, is a design that takes so much time and care that it often outweighs implementing it. Using glass morphism on a flat colour website doesn’t instantly make it more interesting either, you need an already interesting website to fully appreciate the style.


Thanks for reading! I hope you’ve learnt something and put a new tool in your belt.

Enjoy! 🎉

email popup image
Mark Harwood
NEVER miss a blog post again! Subscribe for email notifications whenever a new post is live!
Subscribe
NEVER miss a blog post again! Subscribe for email notifications whenever a new post is live!
Fill Out This Form, And I Will Be In Touch Shortly
Contact form image
I'll Be In Touch Soon