15+ free tools and resources to create awesome user interfaces
Tags: webdev, productivity, beginners, tutorial
Published: 2021-04-29 10:42:45

There is almost nothing more important than the right tools to create a pleasant user interface. The right set of images or a well-balanced color palette can make a huge difference between a bad and a decent user interface.

I'm going to share a list of free and very useful resources/tools that I use on a daily basis to create user interfaces (websites, landing pages, web applications, etc.) for my clients, as well as for my Cruip and SaaS landing page projects.

##**Photos & Videos**

###[Coverr](https://coverr.co/)
![Coverr](https://res.cloudinary.com/practicaldev/image/fetch/s--brY0W06J--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/t6g1emv6khqin32vk8xh.jpg)

###[Pexels](https://www.pexels.com/)
![Pexels](https://res.cloudinary.com/practicaldev/image/fetch/s--XYiFoSig--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/8124nt6a6z58if6qg33o.jpg)

###[Unscreen](https://www.pexels.com/)
![Unscreen](https://res.cloudinary.com/practicaldev/image/fetch/s--XYiFoSig--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/8124nt6a6z58if6qg33o.jpg)

###[Duotone](https://duotone.shapefactory.co/)
![Duotone](https://res.cloudinary.com/practicaldev/image/fetch/s--1iHb7QR0--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/2h8p57u95oeylkveogkm.jpg)

##**Illustrations**

###[Open Doodles](https://opendoodles.com/)
![Open Doodles](https://res.cloudinary.com/practicaldev/image/fetch/s--dyjUF3ic--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/fyybdym14nnwmzqznuay.jpg)

###[Ouch!](https://icons8.com/illustrations)
![Ouch!](https://res.cloudinary.com/practicaldev/image/fetch/s--qOlOExth--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/t1o0rqbxnhrd2l7tz8cx.jpg)

###[Fonts Arena](https://fontsarena.com/)
![Fonts Arena](https://res.cloudinary.com/practicaldev/image/fetch/s--hcN8eWnT--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/eaaz0zzs044krq81e19p.jpg)

###[Befonts](https://befonts.com/)
![Befonts](https://res.cloudinary.com/practicaldev/image/fetch/s--UmAkjTJM--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/bo23qsqu15jn1zl1nkgu.jpg)

##**Iconography**

###[Tilda Icons](https://tilda.cc/free-icons/)
![Tilda Icons](https://res.cloudinary.com/practicaldev/image/fetch/s--X9hwT2IJ--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/qnprxnrhs3q7mo0b0jcp.jpg)

###[IconStore](https://iconstore.co/)
![IconStore](https://res.cloudinary.com/practicaldev/image/fetch/s--Jw_N5uKW--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/l4jez0e27p5dypj1w2wn.jpg)

###[Eva Icons](https://akveo.github.io/eva-icons/#/)
![Eva Icons](https://res.cloudinary.com/practicaldev/image/fetch/s--hcN8eWnT--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/eaaz0zzs044krq81e19p.jpg)

###[Animated Icons](https://icons8.com/animated-icons)
![Animated Icons](https://res.cloudinary.com/practicaldev/image/fetch/s--woEGvXxj--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/h6bdsp0ncewr5y08m1cz.jpg)

##**Utility**

###[Checklist design](https://www.checklist.design/)
![Checklist design](https://res.cloudinary.com/practicaldev/image/fetch/s--sK4P2V6m--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/zp5jhmabxmcmaff0qyrf.jpg)

###[CSSPeeper](https://csspeeper.com/)
![CSSPeeper](https://res.cloudinary.com/practicaldev/image/fetch/s--kEyXAhcq--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/81xuc8grkv554yns9c5r.jpg)

###[Nucleo App](https://nucleoapp.com/)
![Nucleo App](https://res.cloudinary.com/practicaldev/image/fetch/s--3acDUiG_--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/g0tkn2udwkybspsie3yv.jpg)

##**Animations & Effects**

###[CSSeffectsSnippets](https://emilkowalski.github.io/css-effects-snippets/)
![CSSeffectsSnippets](https://res.cloudinary.com/practicaldev/image/fetch/s--sCZsg7Tf--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/qa8jrycws1y3oja15dyq.jpg)

###[Animista](https://animista.net/)
![Animista](https://res.cloudinary.com/practicaldev/image/fetch/s--zY5Cvisf--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/f5ied19urcioqeyt6igr.jpg)

###[Block Reveal Effects](https://tympanus.net/Development/BlockRevealers/index.html)
![Block Reveal Effects](https://res.cloudinary.com/practicaldev/image/fetch/s--RQZMMB6a--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/09g2o731cc25efw3bfi8.jpg)

Conclusion
I hope you enjoyed this list of free tools and resources. Thank you for reading and have a nice day!