Awesome Websites for UI Components
Tags: webdev, javascript, react, beginners
Published: 2022-11-21 11:30:00

## Introduction

UI plays an important role in terms of providing visuals to your website. A modern good looking UI attracts people. UI is the first thing that a user is going to see. So, a good UI becomes necessary.

A UI is made up of different components. Today, we are going to look into some websites from where you can get beautiful UI Components. This list of the website is from my ebook/notion template, [50+ Awesome tools for Web Developers](https://surajondev.gumroad.com/l/50-tools-web-developers). You can check it.

Let's get started with the list.   

## [Flaticon](https://www.flaticon.com/)

> Download Free Icons and Stickers for your projects. Resources made by and for designers. PNG, SVG, EPS, PSD, and CSS formats

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xkzflo2pf1rr3b0o8ti7.png)

FlatIcon has a huge library of icons that you can use in your design and build a web page. They have over 8 Million vectors and stickers. I do use their platform to get some icons for the web pages. They have a variety of icons in different sizes. Icons are available in SVG, PSD, PNG, and EPS formats.

---

## [Blush Design](https://blush.design/)

> Blush makes it easy to add free illustrations to your designs. Play with fully customizable graphics made by artists across the globe.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9c082iuta9xx164bbaeh.png)

You can create customized illustrations from unDraw. You don’t have to draw an illustration from scratch they already have elements and you can assemble them to make an awesome illustration. They also have pre-created illustrations that you can customize or directly download for your design and web pages. I like to get humans kind of illustrations from the website to create landing pages for my website.

---

## [ColorHunt](https://colorhunt.co/)

> Discover the newest hand-picked color palettes of Color Hunt. Get color inspiration for your design and art projects.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4fvqa4n1q02h6dxhh6rh.png)

Tons of color pallets to use in your design. You can get a lot of inspiration and color pallet to use in your next design. I regularly visit the website to get popular and trendy color pallets. Along with using in design, I also used the color pallets in creating thumbnails for my articles.

---

## [Google Fonts](https://fonts.google.com/)

> Making the web more beautiful, fast, and open through great typography

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/w1mapy8wmz540gqwjht2.png)

One of the best websites to integrate awesome fonts into your website. Google font is easy to install with link and import. It is an open-source font library of more than 1,400 fonts. I have recently started using it to add better fonts to my web pages. In addition to fonts, it also has a huge collection of icons.

---

## [Error 404](https://error404.fun/)

> Make a unique journey through 404 error pages on your website Use these illustrations that describe better than words

![Error 404](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/85sbp4bjcjshzx3vqeww.png)

It’s a fun web page to explore for 404-page error page illustrations. It has a lot of free illustrations related to a 404(Not found) error page. You can download and use it in your designs and web pages. There are also examples, you can look into for inspiration.

## Connect With Me

- [Twitter](https://twitter.com/surajondev)
- [LinkedIn](https://www.linkedin.com/in/surajondev/)

## Conclusion

I hope this article has helped you in knowing some awesome websites for UI components. Feel free to mention any other tool/website in the comment, might add it in the upcoming part. 

You can check the [50+ Awesome tools for Web Developers](https://surajondev.gumroad.com/l/50-tools-web-developers) if you are interested in such a tool.

Thanks for reading the blog post.