16 bộ icon miễn phí tốt nhất cho thiết kế UI

Khi nói đến thiết kế giao diện người dùng và thiết kế web hiện đại, một bộ icon chất lượng tốt là vô giá và có thể giúp nâng tầm hoặc phá vỡ một thiết kế.

Chắc chắn không thiếu các bộ icon khác nhau trên Internet. Chỉ cần tìm kiếm nhanh trên Google, bạn sẽ thấy hàng trăm bộ icon, nhiều bộ trong số đó là mã nguồn mở và miễn phí 100%. Vấn đề là không phải tất cả các bộ biểu tượng được tạo ra như nhau.

Việc chọn một bộ icon chất lượng tốt có thể tốn thời gian ngang với việc tạo các icon tùy chỉnh của riêng bạn. Chính vì lý do này, Quantrimang.com đã tổng hợp danh sách 16 bộ icon miễn phí tốt nhất cho thiết kế UI sau đây nhằm giúp bạn tiết kiệm thời gian quý báu của mình.

1. Untitled UI Icons

1.100+ icon thiết yếu miễn phí cho thiết kế giao diện người dùng hiện đại

Untitled UI Icons là một thư viện icon rõ ràng, nhất quán và trung tính được tạo riêng cho thiết kế giao diện người dùng hiện đại.

Bộ icon miễn phí 100% này bao gồm hơn 1.100 biểu tượng cần thiết cho thiết kế giao diện người dùng hiện đại, được sắp xếp gọn gàng trên 19 danh mục. Ngoài ra còn có các kiểu duotone và duocolor bổ sung có sẵn tại unaitledui.com/icons nếu bạn muốn thứ gì đó hơi khác một chút.

Untitled UI Icons ra mắt vào đầu tháng 6 năm 2022. Nó đã được bình chọn là sản phẩm số 1 của Cuộc săn tìm sản phẩm trong tuần và được tải xuống hơn 20.000 lần trong 2 tuần đầu tiên. Hiện nó là bộ icon được xếp hạng cao nhất trên Gumroad và đã được tweet lại 1.300 lần trên Twitter. Bạn có thể sử dụng thư viện khổng lồ này trong nhiều dự án tùy thích.

2. Feather Icons

287 icon miễn phí

Feather Icons không phải là bộ icon miễn phí lớn nhất trong danh sách này, nhưng chúng sẽ luôn là một trong những icon được yêu thích. Gói icon tối giản miễn phí này được tạo ra bởi Cole Bemis và có 287 icon mã nguồn mở đơn giản, đẹp mắt.

Mỗi icon được thiết kế trên lưới 24x24 với trọng tâm là sự đơn giản, nhất quán và dễ nhìn. Nếu bạn đang tìm kiếm một thư viện icon nhẹ và có thể mở rộng sẽ hoạt động trong hầu hết mọi dự án, Feather Icons là một lựa chọn tuyệt vời! Đó là một trong những bộ icon phổ biến nhất trên thế giới.

Bạn có thể tải xuống toàn bộ thư viện ở định dạng SVG dưới dạng file .zip từ trang web của nhà phát triển.

3. Majesticons

720 icon miễn phí trên 2 phong cách (360 icon cho mỗi phong cách)

Majesticons là một bộ icon hữu ích được tạo ra bởi Gerrit Halfmann. Chúng bao gồm 720 icon miễn phí theo hai kiểu - Line và Solid.

Bộ icon này được yêu thích vì một vài lý do. Thứ nhất, chúng siêu tối giản và nhất quán, có nghĩa là chúng sẽ hoạt động tốt trên bất kỳ loại thiết kế web hoặc dự án thiết kế UI nào. Thứ hai, chúng rõ ràng được tạo ra một cách cẩn thận bởi một người chuyên nghiệp và dễ dàng tùy chỉnh ngay trong Figma!

Nếu bạn cần nhiều icon hơn nữa trong tương lai, nhà phát triển cũng có một gói icon mở rộng với hơn 3.200 icon vectơ được chia thành 48 danh mục (có tính phí). Nó trông rất tuyệt và được thực hiện bằng Figma dựa trên hệ thống lưới 24px với chiều rộng nét vẽ 2px.

4. Unicons của IconScout

1.100+ icon miễn phí

Unicons là một icon tuyệt vời do nhóm IconScout tạo ra. Mặc dù bộ icon khổng lồ hơn 4.500+ Unicons là bộ icon trả phí, nhưng nhà phát triển đã hào phóng phát hành thư viện hơn 1.100 icon miễn phí.

Bộ icon miễn phí của IconScout bao gồm hơn 1.100 icon được sáng tạo cẩn thận trên lưới 24px với chiều rộng nét vẽ 1px. Bộ icon miễn phí này rất lớn và người dùng đặc biệt thích cách nó được sắp xếp hợp lý thành 27 danh mục.

Bạn có thể tải xuống bộ icon dưới dạng SVG cũng như web font/icon font thông qua trang web chính thức.

5. Heroicons (1.0)

230 icon miễn phí

Heroicons v1.0 là một thư viện icon mã nguồn mở và cực kỳ phổ biến được tạo ra bởi Steve Shoger, một trong những người sáng tạo ra Tailwind CSS.

Nó bao gồm 230 icon thủ công đẹp mắt và tối giản được MIT cấp phép. Tương tự như Feather Icons, bộ icon này sẽ không phải là lớn nhất trong danh sách này, nhưng được yêu thích, vì nó trung tính và sẽ phù hợp với khá nhiều dự án.

Heroicons cũng độc đáo ở chỗ nó bao gồm 2 phong cách riêng biệt, phù hợp cho nhiều trường hợp sử dụng. Các outline icon được tạo với nét có độ đậm 2px và thiết kế để hiển thị ở 24x24px. Đối với những trường hợp sử dụng nhỏ hơn như các nút và phần tử biểu mẫu, bộ icon này cũng bao gồm các solid icon được thiết kế để hiển thị ở 20x20px.

Sự chú ý đến từng chi tiết này là điều khiến các Heroicons trở nên khác biệt với hàng trăm bộ icon lớn hơn nhiều không có trong danh sách này.

Bạn có thể tải xuống bộ icon dưới dạng SVG thông qua trang web của nhà phát triển hoặc sao chép file Figma Community chính thức.

6. Heroicons (2.0)

292 icon miễn phí

Sau thành công của Heroicons v1.0, Steve Shoger đã tung ra Heroicons 2.0 vào tháng 8 năm 2022.

Thư viện mới có 292 icon đã được vẽ lại hoàn toàn từ đầu theo phong cách mới. Tương tự như Heroicons 1.0, bộ icon này bao gồm 2 kiểu riêng biệt, phù hợp với mỗi trường hợp sử dụng của bạn. Các outline icon mặc định được thiết kế để hiển thị ở 24x24px và bao gồm một kiểu khối phù hợp mới. Đối với các trường hợp sử dụng nhỏ hơn như các nút và phần tử biểu mẫu, bộ icon cũng bao gồm một kiểu mini nhỏ hơn được thiết kế để hiển thị ở 20x20px.

Một điểm khác biệt đáng chú ý giữa phiên bản 1.0 và 2.0 là nét vẽ mảnh hơn ở mức 1.5px theo mặc định.

Cũng giống như Heroicons 1.0, bộ này được thiết kế rất đẹp mắt và Steve đã hào phóng làm cho bộ icon này miễn phí 100% với giấy phép MIT. Như đã đề cập trước đó, bộ Heroicons mới này không phải là một thư viện lớn, nhưng nó có chất lượng cực kỳ cao và xứng đáng được phổ biến rộng rãi như vậy.

Bạn có thể tải xuống bộ icon dưới dạng SVG thông qua trang web hoặc sao chép file Figma Community chính thức.

7. Iconoir

1.151 icon miễn phí

Iconoir là một bộ icon mã nguồn mở tuyệt vời được thiết kế bởi nhà thiết kế sản phẩm Lucia Burgio. Nó được đóng gói đầy đủ với hơn 1.100 icon ở định dạng SVG, cũng như các thư viện icon cho React, React Native, Figma và Framer.

Những icon này có phong cách siêu tối giản. Chúng lý tưởng cho thiết kế giao diện người dùng hiện đại. Đến nỗi Framer đã tích hợp chúng vào phần mềm thiết kế của họ vào tháng 6 năm 2021!

Bộ icon Iconoir có nguồn mở và miễn phí 100% (bạn có thể xem trước từng icon SVG trên trang web của nhà phát triển). Nếu thấy hữu ích, bạn có thể ủng hộ người sáng tạo trên Open Collective.

8. css.gg

704 icon miễn phí

css.gg là bộ icon mã nguồn mở duy nhất được viết hoàn toàn bằng CSS. Nó gần đây được tạo ra bởi nhà phát triển frontend, Astrit Malsija, người cũng điều hành một kênh YouTube với các mẹo CSS hữu ích.

Bộ icon được tổ chức tốt và bao gồm 704 icon miễn phí có sẵn dưới dạng CSS và SVG. Nó đã được chứng minh là vô cùng phổ biến, thậm chí các thành viên cộng đồng đã đóng góp những file Figma và Adobe XD.

9. Phosphor Icons

6.282 icon miễn phí với 6 phong cách (1.047 icon cho mỗi phong cách)

Phosphor Icons là một bộ icon miễn phí được thiết kế bởi Helena Zhang và Tobias Fried. Đó là một thư viện gọn gàng, nhất quán và khổng lồ gồm 1.047 icon với 6 phong cách khác nhau.

Bạn có thể tải xuống Phosphor Icons dưới dạng SVG riêng lẻ. Nhóm cũng đã phát hành file Figma Community và plugin Figma tiện dụng, cũng như plugin Sketch và cài đặt NPM.

10. Streamline Core Line Icons

1.000 icon miễn phí

Streamline Core Line Icons là một bộ icon khổng lồ có mã nguồn mở theo Giấy phép Creative Commons. Đây là một thư viện miễn phí khổng lồ bao gồm 1.000 icon vector.

Bạn có thể tải xuống bộ icon này thông qua trang web chính thức. Họ cũng có một plugin Figma phổ biến có sẵn trên Figma Community để bạn có thể tìm kiếm các icon mà không cần rời khỏi Figma.

Gói icon miễn phí này là một phần trong Core Line Icons lớn hơn của Streamline - Bộ icon Pro - bộ sưu tập icon hoàn chỉnh dành cho thiết kế giao diện người dùng, với 2.025 icon vector trên 14 danh mục.

11. Tabler Icons

1.950 icon miễn phí

Tabler Icons là một bộ icon đáng tin cậy được tạo bởi nhà phát triển web Paweł Kuna. Chúng là một ví dụ tuyệt vời khác về một bộ icon đơn giản và được thiết kế tốt, đủ linh hoạt và đủ lớn để sử dụng trong bất kỳ dự án nào.

Toàn bộ gói icon là mã nguồn mở và được sử dụng miễn phí trong các thiết kế. Bạn thậm chí có thể xem trước các icon trông như thế nào ở các kích thước và độ dày nét vẽ khác nhau thông qua trang web của nhà phát triển.

Tabler Icons là bộ icon mã nguồn mở và miễn phí, nhưng bạn có thể hỗ trợ người tạo bằng cách quyên góp trên GitHub.

12. Ionicon

Hơn 700 icon miễn phí với 3 phong cách

Ionicons là một bộ icon mã nguồn mở và được cấp phép MIT, xây dựng bởi nhóm phát triển đứng sau Ionic Framework. Bộ icon này bao gồm hơn 700 icon miễn phí theo 3 phong cách. Chúng cũng bao gồm các icon mạng xã hội hữu ích!

Bạn có thể tải xuống toàn bộ thư viện ở định dạng SVG dưới dạng .zip. Nhóm Ionic cũng đã phát hành một plugin Figma hữu ích để bạn có thể tìm kiếm Ionicons ngay từ bên trong Figma.

13. Remix Icon

2.271 icon miễn phí trên 2 phong cách (1.135 icon cho mỗi phong cách)

Remix Icon là một tập hợp 2.271 icon trung tính theo 2 phong cách.

Gói icon miễn phí này được duy trì bởi Remix Design - bộ đôi Jimmy Cheung và Wendy Gao. Họ đã hào phóng biến thư viện icon này thành mã nguồn mở, có nghĩa là gói icon được sử dụng miễn phí 100% cho cả mục đích cá nhân và thương mại. Nếu bạn thấy nó hữu ích, hãy cân nhắc đóng góp cho dự án thông qua liên kết Donate trên trang web của nhà phát triển!

Tải xuống miễn phí gói icon này qua trang web chính thức dưới dạng một file .zip duy nhất chứa các file SVG, dưới dạng icon font hoặc thậm chí dưới dạng cài đặt NPM.

14. Eva Icons

480 icon miễn phí trên 2 kiểu (240 icon mỗi kiểu)

Được tạo bởi Akveo và đội ngũ đằng sau Eva Design Assets, Eva Icons là một bộ gồm 480 icon mã nguồn mở được thiết kế đẹp mắt ở định dạng SVG và PNG. Nhà phát triển cũng đã bao gồm cả thư viện Figma và Sketch.

Bộ icon có hai phong cách chính, tuân theo nguyên tắc tối giản. Tuy nhiên, điều quan trọng cần lưu ý là các icon này đã được chuyển đổi thành outline. Điều này có nghĩa là bạn sẽ không thể tùy chỉnh độ đậm của nét vẽ hoặc các góc, v.v…

15. Tetrisly Icons

266 icon miễn phí trên 3 kích thước

Tetrisly Icons là một bộ icon miễn phí được tạo ra bởi đội ngũ đằng sau Tetrisly. Gói icon này là duy nhất vì nó bao gồm 3 kích thước khác nhau (16px, 20px hoặc 24px), tùy thuộc vào nhu cầu của bạn.

Bộ icon này miễn phí 100% cho mục đích sử dụng cá nhân và thương mại theo Giấy phép Creative Commons. Bạn có thể tải xuống miễn phí bộ icon thông qua trang Gumroad, bao gồm các file định dạng SVG, Figma và Sketch.

16. Doodle Icons

Hơn 400 icon miễn phí

Có hàng trăm bộ icon miễn phí trên Figma Community nhưng bộ icon thực sự nổi bật là Doodle Icons của Khushmeen Sidhu.

Doodle Icons đi kèm với hơn 400 icon được làm thủ công và 100% miễn phí để sử dụng cho các dự án thương mại và cá nhân theo giấy phép Creative Commons. Điều làm cho bộ icon này nổi bật so với mọi thư viện khác trong danh sách là phong cách vẽ tay độc đáo của nó. Mặc dù nó có thể không phù hợp với mọi dự án, nhưng đó là một cách tuyệt vời để tạo sự khác biệt cho các thiết kế và thêm một chút cá tính vào những dự án sáng tạo, vui nhộn.

Bạn có thể tải xuống toàn bộ thư viện dưới dạng SVG, PNG, cũng như thư viện Figma thông qua trang web của nhà phát triển.