Tổng hợp thư viện miễn phí UI/UX Graphic Designer’s khổng lồ

Trong thiết kế UI/UX bên cạnh việc làm ra sản phẩm đẹp và sáng tạo, các sản phẩm thiết kế đó phải dễ sử dụng. Các nhà tâm lý học đã đặt ra các nguyên tắc từ lâu, và điều thú vị là chúng vẫn còn giữ nguyên giá trị cho các nhà thiết kế UI/UX hiện đại.

Bộ tài liệu chiasefree.com chia sẽ dưới đây sẽ giới thiệu cho bạn các thư viện /UX Graphic Designer’s khổng lồ, giúp bạn nâng cao kỹ năng và tạo trải nghiệm người dùng tốt. Chúng ta cùng nhau tìm hiểu nhé!

Tổng hợp thư viện miễn phí UI/UX Graphic Designer's khổng lồ
Tổng hợp thư viện miễn phí UI/UX Graphic Designer’s khổng lồ

Thư viện UI/UX Graphic Design là gì?

UI là gì?

UI (user interface) là thuật ngữ dùng để chỉ giao diện người dùng, bao gồm những yếu tố mà mắt thường chúng ta có thể nhìn thấy và cảm nhận được trên website như màu sắc, hình ảnh, bố cục, video clips, giai điệu, font chữ…vv

UI được xem là bộ mặt của website. Thế nên, nếu muốn thu hút được sự quan tâm của khách hàng, bạn cần thiết kế UI thật ấn tượng. Đồng thời, UI cũng giúp cho việc truyền tải thông điệp đến khách hàng một cách trực quan, dễ dàng hơn.

UX là gì?

UX (user experience) là thuật ngữ dùng để chỉ trải nghiệm của người dùng. UX có nhiệm vụ chính là quan sát, dõi theo cũng như ghi nhận các phản hồi từ phía người dùng. Sau đó, bộ phận này sẽ không ngừng cải tiến và nâng cao chất lượng để tối ưu hóa trải nghiệm của khách hàng.

UX sẽ tập trung vào việc nghiên cứu về thói quen, hành vi khách hàng để đưa ra các chiến lược, mục tiêu phát triển nhằm đem lại cảm giác thoải mái, thích thú mỗi khi người dùng truy cập vào website.

Tóm lại, UI là những gì mà khách hàng có thể nhìn thấy về website, còn UX là những suy nghĩ, phản hồi của khách hàng khi truy cập tại website.

UI UX designer là những nhà thiết kế nhằm nâng cao chất lượng cả giao diện lẫn trải nghiệm của người dùng để mang đến kết quả tốt nhất cho doanh nghiệp.

Tổng hợp thư viện miễn phí UI/UX Graphic Designer’s khổng lồ

UI Graphics

Các trang web và tài nguyên có các thành phần giao diện người dùng hiện đại ở các định dạng khác nhau như PSD, Sketch, Figma, v.v. Chúng rất phù hợp cho các ý tưởng cho các thành phần web / giao diện người dùng

WebsiteDescription
UI Design Daily 100Awesome UI Components of all types
100 Daily UI 32Thư viện Figma miễn phí về các sản phẩm, phần tử và màn hình
Sketch App Sources 18Sketch UIs, wireframes, icons and much more
Humaaans 29Những hình ảnh minh họa tuyệt vời về những người có khả năng trộn và kết hợp
Paaatterns 19Bộ sưu tập miễn phí các mẫu đẹp cho tất cả các định dạng vector
thepatternlibrary 18Mẫu nền đẹp miễn phí
404 illustration 25minh họa miễn phí cho trang 404
Drawkit.io 18Hình minh họa cho các nhà thiết kế và khởi nghiệp
Undraw.co 10Hình ảnh minh họa mã nguồn mở cho bất kỳ ý tưởng nào bạn có thể tưởng tượng và sáng tạo
Illustration.co 22Bộ minh họa mã nguồn mở
Manypixels.co 9Hình minh họa đơn sắc, Isometric chất lượng cao
Opendoodles 15Free sketchy illustrations
Open Peeps 7Thư viện minh họa vẽ tay
UI Space 20Hàng nghìn giao diện người dùng miễn phí tuyệt vời
Animations.co 23Biểu tượng GIF động đẹp, có thể tùy chỉnh
Uplabs 14Tài nguyên thiết kế chất lượng cao (Miễn phí & Cao cấp)
InvisionApp 10Thư viện các bộ giao diện người dùng, gói biểu tượng và mô hình miễn phí, chất lượng cao
Open Doodles 15Một bộ Hình minh họa Sơ đồ Miễn phí
Avataaars 9Thư viện phác thảo miễn phí các minh họa avatar của Pablo Stanley
FreebieSketch 13Thiết kế Sketch miễn phí, wireframe, hình minh họa và hơn thế nữa.
Blush 7Hình minh họa có thể tùy chỉnh miễn phí với Plugin Figma
Hero Patterns 18Bộ sưu tập các mẫu nền SVG có thể lặp lại

Fonts

Các trang web cung cấp phông chữ miễn phí cũng như các công cụ dựa trên phông chữ

WebsiteDescription
Google Fonts 5Thư viện khoảng 1000 phông chữ được cấp phép miễn phí
DaFont 2Lưu trữ các font chư co thể tải miễn phí
Use & Modify 2Lựa chọn cá nhân các kiểu chữ đẹp, sang trọng, punk, chuyên nghiệp, không hoàn chỉnh, kỳ lạ
1001 Free Fonts 1Tôi nghĩ cái tên đã nói lên chính nó
Font Squirrel 1Font Squirrel lùng sục trên internet để tìm kiếm các phông chữ miễn phí hợp pháp, chất lượng cao
Font FabricMột xưởng đúc kiểu kỹ thuật số tạo ra các phông chữ bán lẻ và kiểu chữ tùy chỉnh cho các thương hiệu khác nhau
What FontCông cụ để tìm phông chữ của một trang web mà không cần phải tìm kiếm trong devtools
Tiff 1Một công cụ khác biệt kiểu tương phản trực quan sự khác biệt giữa hai phông chữ
Font Flame 1Công cụ ghép nối các phông chữ để xem chúng trông như thế nào với nhau
TypeKit PracticeTìm hiểu về thực hành kiểu chữ
FontjoyGenerate font pairing in one click
Golden Ratio 1Golden Ratio Typography Calculator
FontSpark 1Discover Better Fonts
FontPairHelps you pair Google Fonts together
Font SpaceA designer-centered free font website that has quick customizable previews
Abstract Fonts 3Fonts free for personal and commercial use
Free Typography 2A list of high quality fonts
Leon Sans 1A geometric sans-serif typeface made with code
LexendA variable font empirically shown to significantly improve reading-proficiency
Fonts for Apple PlatformsGet the details, frameworks, and tools you need to use system fonts for Apple platforms in your apps
SFWinSan Francisco Fonts for Windows 10 and non-Apple Platform
Font FlipperPreview 800+ Google Fonts on top of your own designs, without having to download the fonts
Fonts Arena 1Free curated fonts
Befonts 2High quality fonts for free
Arabic fonts 1Arabic fonts for free
FontDropSimple and easy way to view the contents of font files

Colors

Các trang web và tài nguyên giúp đưa ra các lựa chọn liên quan đến màu sắc

WebsiteDescription
Colormind.io 16Color palette generator
ColorCurves.app 4Color palette generator that uses curves to generate color palettes
Coolors 4Create the perfect palette or get inspired by thousands of beautiful color schemes
Colors & Fonts 3A curated library of colors, fonts and resources
Palette List 4Pick 2 colors you like and the tool generates thousands of palettes for you.
Google Material Color Tool 5Official Google Material Color Palette Tool
Material Palette 2Free to pick palettes, icons and colors for Material Design
ColorSpace 1Generate nice color palettes from one color
FlatUIColors 2Beautiful set of color palettes in various flavours
Adobe Color 1Create color palettes, extract gradients from images, etc
Colorsinspo 1All-in-one resource for finding everything about colors
Happyhues 1Happy Hues is a color palette inspiration site that acts as a real world example as to how the colors could be used in your design projects by Mackenzie Child
Adobe Trends 2Discover current color trends in different industries from the creative communities on Behance and Adobe Stock
Color HuntA free and open platform for color inspiration with thousands of trendy hand-picked color palettes
Gradient Hunt 2A free and open platform for gradient inspiration with thousands of trendy hand-picked color gradients
Web Gradients 7A free website to find good css gradients
ColorBoxA free website to produce color set
CSS gradient 3A free website to make custome gradient and some examples of gradient
gradientaA pure css and jpg gradients
UI Gradients 2UI gradients color generator
Palette Generator 1Generate new color palette with every spacebar press
Material Palettes1000+ Material Design palettes
GrabientGradient Selector
ShadeSwash 1Quickly generate shades of any color
BrandColors 1The biggest collection of official brand color codes
BRAND PALETTES 3Logo Color Codes and Palettes
ColorSpace 1Generate color palettes from one color
Material Design Palette Generator 2Generate theme and color palette Material Design-like
ColorateColor scheme tool for designers and developers. This will help you draw inspiration and serve as a resource for your color work.
0to255A color tool that makes it easy to lighten and darken colors. It’s perfect for hover states, borders, gradients, and more.
Gradient Buttons 2Ready to use copy/paste gradient buttons
Khroma 2Khroma uses AI to learn which colors you like and creates limitless palettes for you to discover, search, and save.
whocanuseA tool that brings attention and understanding to how color contrast can affect different people with visual impairments.
ColorableColor combination contrast tester
Color Hex PickerTool to get hex code along with name of the color.
SaruwakakunThe stunning color scheme for website & App Designs with previews
PalettonPaletton.com is a designer color tool designed for creating color combinations that work together well.
ColorzillaA powerful online photoShop-like CSS gradient editor
Image Color PickerImage color picker and palette generator
CombineCOLORSColor mixing tool

Icons

Tài nguyên cho các biểu tượng bao gồm png, svg và hơn thế nữa

WebsiteDescription
UXWing 15Well Optimized, Free icons for commercial use
Shapedfonts Iconclub 138000+ free icons
Feather Icons 1Beautiful, customizable open source icons
Tabler Icons 2470+ highly customizable open source SVG icons
Simple Icons 61307 Free SVG icons for popular brands
Instant Logo Search 6thousands of free brands logos ( SVG – PNG )
Linear Icons 21000+ Ultra crisp vector icons
Entypo 3411 carefully crafted premium pictograms by Daniel Bruce
Icons8 3Free icons, photos, vectors and tools
Flat Icon 4The largest database of free icons in PNG, SVG, EPS, PSD and BASE 64 formats
The Noun Project 3Over 2 Million curated icons, created by a global community
Iconscout 1Free Download Icons illustrations stock photos at one place
Nucleo App 1Nucleo is a beautiful library of 27500 icons, and a powerful application to collect, customize and export all your icons. (Free & Paid)
Icon-icons.com 1Free Icons PNG, ICO, ICNS and Vector file SVG
Bootstrap Icons 3Free Icons built for Bootstrap but they’ll work in any project
Remix Icon 1Simply Delightful Icon System
Iconmonstr 1Discover 4496+ free icons in 313 collections
Vivid.js 1Ready to use Free and Open Source SVG Icons Pack JavaScript Library.
Iconfinder 3Free and premium vector icons in SVG, PNG, CSH and AI format
Lordicon 150 free animated interactive icons
UseAnimations 3Free Animated Icons in SVG and Json Format(for lottie)
css.gg 1700+ Open-source CSS, SVG and Figma UI Icons Available in SVG Sprite, styled-components, NPM & API
SVGPorn 61000+ high-quality SVG logos
Payment System LogosLogos for payment systems available in png and svg
Browser Logos 2High resolution web browser logos
IconBros7843+ free icons grouped in 182 collections
LogoHub 2Generate and download your logo for free in PNG and SVG format
Material Design Icons 2A icon collection allowing designers and developers targeting various platforms to download icons in the format, color and size they need for any project.
Heroicons 1Free, open source icons from the creators of Tailwind CSS.
Zondicons 1A set of free premium SVG icons for you to use on your digital products.
Endless Icons 1A website offering a number of free icons. Icons are tagged and also compressed into kits.
IcomoonBrowse 5500+ Free Icons. Add any set you wish to easily browse and search its icons.
Eva IconsEva Icons is a pack of more than 480 beautifully crafted Open Source icons for common actions and items.
ZondiconsA set of free premium SVG icons for you to use on your digital products. you can download the icons into your desktop
Entypo 3411 carefully crafted premium pictograms
CryptoiconsA set of 430 crypto and fiat currency icons. Completely free.
IkonateFully customisable & accessible vector icons
appiconQuickly generate app icons in diffrent sizes for your IOS, macOS and Android projects
LineIcons 12000+ Essential Line Icons for Designers and Developers

Favicons

Tài nguyên cho Favicons

WebsiteDescription
Favicon.io 9Generate a favicon from text, from an image, or from an emoji. Download in .ico and .png formats
Favicon Generator 1Generate favicon ico files for your website
RealFaviconGenerator 2Generate icons for all platforms (Windows, iOS, Android)
FontIcon 2Generate favicons and images from Font Awesome icons

Icon Fonts

Tài nguyên cho Phông chữ Biểu tượng

WebsiteDescription
Font Awesome 3The web’s most popular icon set and toolkit
Line Awesome 1Swap in replacement of Font Awesome with modern line icons
Material IconsMaterial design icon library
IonIcons 1Beautifully crafted open source icons from Ionic team
Zurb Foundation IconsCustomizable Foundation icons
Fontisto Icons 1Fontisto the iconic font and css toolkit · 616+ free icons
BoxiconsBoxicons is a free collection of carefully crafted open source icons
Icofont2100+ free icons to spice up your creative designs
Material PaletteFree to pick palettes, icons and colors for Material Design]
Material Design Iconic FontMaterial design icon font
Vscode Codicons 2The icon font from Visual Studio Code
DeviconDevicon is a set of icons representing programming languages, designing & development tools
PaymentFont 2A sleek webfont for payment operators and methods. Featuring 116 icons
Weather IconsWeather Icons is the only icon font with 222 weather themed icons
Stroke 7202 thin stroke icons inspired by iOS 7
Jam Icons890+ handcrafted icons to make your web app awesome
Fontastic.me 2Create your custom icon fonts in seconds. Over 9,000 icons available to pick from or upload your custom svg
Fontello 1200+ web icons where you can customize the names or codes of icons.
Linea 1Linea: Featuring 750+ Free Icons

Stock Photos

Các trang web cung cấp kho ảnh miễn phí về tất cả các loại cho các trang web và ứng dụng của bạn

WebsiteDescription
Pexels 15Free stock photos shared by talented creators
Unsplash 6The internet’s source of freely usable images
Pixabay 6Over 1.7 million+ high quality stock images and videos
Magdeleine 6Gallery & free high res photo everyday
Picspree 3Royalty free images, stock photos, illustrations, and vectors
Burst 3Free stock photos collections
Gratisography 2Free collection of free high-resolution pictures
Life of Pix 1Free high resolution photography
Stock SnapHundreds of high quality photos added weekly
Morguefile 1Over 350,000 free stock photos for commercial use
Kaboom PicsStock photography and color palettes. Good for product images
New Old Stock 1Stock vintage photos
Pic JumboGood collections of different types of photos
Public Domain PicturesPublic domain images of all types
Find A Photo 1Searches multiple stock photo websites
StockvaultCategorized stock photos
PlaceholderA free image placeholder service for the web. You can specify image size and format
Realistic Shots 1Free high resolution stock photos
Negative SpaceHigh-Resolution Free Stock Photos
SkitterPhotoFree high resolution photography
PicoGraphyGorgeous, High-Resolution, Free Photos
Wunder Stock 1Stunningly amazing free photos
PxHereFree Images & Free stock photos – PxHere
PiqselsRoyalty Free Stock Photos
FoodiesFeed 1Food photo stock
NappyA website offering Beautiful, high-res photos of black and brown people.
Generated Photos 4Unique AI Generated model photos

Stock Videos

Các trang web cung cấp kho video miễn phí đủ loại cho các trang web và ứng dụng của bạn

WebsiteDescription
Pexels 7Largest library of free to use videos, donated by the community
Pixabay 1Large library of free to use videos, donated by the community similar to Pexels
Coverr.co 4Beautiful free stock video footage
Videezy 4Free HD stock footage & 4K videos
Mix Kit 2Stock video clips & music
Life Of Vids 4Free video clips and loops
Videvo 8Free and premium stock videos

Stock Music & Sound Effects

Trang web cung cấp kho nhạc miễn phí và / hoặc hiệu ứng âm thanh

WebsiteDescription
Free Stock Music 4Royalty free stock music for YouTube videos, podcasts, etc
Bensound 2Download Royalty Free Music for free and use it in your project
Mixkit 2Free music for your projects
Freesound 1Free stock music and sounds
Free Music Archive 1Collaborative database of creative-commons licensed sound for musicians and sound lovers
Musopen 2An online copyright free classical music library
Unminus 2Free Premium Music for Your Projects Royalty Free. Cleared for YouTube.

Vectors & Clip Art

Các vector, clipart, hình minh họa, mẫu miễn phí và hơn thế nữa

WebsiteDescription
Vecteezy 7Find and download free vector art
Freepik 8Free vectors, stock photos, PSD and icons
Free Vectors 5Community of vector lovers who share free vector graphics
PNGTree 9png, backgrounds, templates, text effects
Vector4Free 1Free vector graphics
Retro Vectors 2Vintage vectors and graphics
FreebleVectors, patterns, mockups and more
Lukaszadam 3Free Vector atrworks
Illlustrations 22Beautiful 100 Illustrations – png, svg
Clipart 6Choose great clipart, png, coloring pages, drawings and more for your projects from the free collection!
Growwwkit illustrations 3A set of 8 simple, black & white, stylish illustrations
World Vector Logo 3Download vector logos of brands you love
trianglify.io 3Generate low-poly backgrounds, textures, and vectors
blob 1Generate Blob shapes for Web and Flutter apps
HiClipart 5A community for designers to share & download transparent background PNG cliparts

Product & Image Mockups

Tạo mô hình thiết bị và các sản phẩm khác

WebsiteDescription
Smart Mockups 10Create stunning product mockups (free & premium)
Shot Snap 4Create beautiful device mockup images for your app or website design
Screely 3Instantly turn your screenshot into a mockup
Screen Peak 4Create a mockup from a URL
Mockup World 4The biggest source of free photo-realistic Mockups online
Collab ShotReal-time screen grabs and image sharing
Facebook DevicesImages and Sketch files of popular devices
Threed.io 6Generate 3D mockups right in your browser.
Mockuphone 1100% free mockups for all devices including IOS, Android, Windows Phone, Laptop & Desktop and TV

Tổng hợp từ nhiều nguồn internet


Cập nhật ngày: 09/04/2022 lúc: 14:58


Lưu ý:
→ Vui lòng bình luận bằng tiếng Việt có dấu.
→ Hãy dùng tên và email thật của bạn khi comment.
→ Không sử dụng keyword trong ô Name.
→ Nếu có ý định Spam link thì hãy quên đi nhé.
→ Tất cả bình luận đều được kiểm duyệt vì thế hãy cẩn thận trước khi comment.
Xin cám ơn!

Add Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.