design-resources-for-developers
开发者设计资源大全：UI、字体、图标等全方位收录
这是一个全面收录设计资源的开源项目,涵盖UI图形、字体、颜色、图标、模板等多个领域。从UI组件到设计工具,项目提供了现代Web和移动应用开发所需的各类设计元素。内容持续更新,旨在帮助开发者快速获取优质设计素材,提升项目视觉效果。
设计资源UI组件字体颜色图标插图Github开源项目
Please read contributing guidelines before submitting new resources.
Table of Contents
- UI Graphics
- Fonts
- Colors
- Icons
- Logos
- Favicons
- Icon Fonts
- Stock Photos
- Stock Videos
- Stock Music & Sound Effects
- Vectors & Clip Art
- Product & Image Mockups
- HTML & CSS Templates
- CSS Frameworks
- CSS Methodologies
- CSS Animations
- Javascript Animation Libraries
- Javascript Chart Libraries
- UI Components & Kits
- React UI Libraries
- Vue UI Libraries
- Angular UI Libraries
- Svelte UI Libraries
- React Native UI Libraries
- Design Systems & Style Guides
- Online Design Tools
- Downloadable Design Software
- Design Inspiration
- Image Compression
- Chrome Extensions
- Firefox Extensions
- AI Graphic Design Tools
- Others
UI Graphics
Websites and resources with modern UI components in different formats such as PSD, Sketch, Figma, etc. They are great for ideas for web components/UI
| Website | Description |
|---|---|
| SVG sine waves | Export perfect sine waves as SVG for your front-end projects |
| UI Design Daily | Awesome UI Components of all types |
| 100 Daily UI | Free Figma library of products, elements, and screens |
| Sketch App Sources | Sketch UIs, wireframes, icons and much more |
| Humaaans | Cool illustrations of people with the ability to mix and match |
| Paaatterns | Free collection of beautiful patterns for all vector formats |
| 404 illustration | Free illustrations for 404 pages |
| Drawkit.io | Illustrations for designers and startups |
| Absurd.design | Free surrealist illustrations for designers and developers |
| Undraw.co | Open-source illustrations for any idea you can imagine and create |
| Manypixels.co | Monochromatic, Isometric high-quality illustrations |
| Open Peeps | Hand drawn illustration library |
| Animations.co | Beautiful, customizable animated GIF icons |
| InvisionApp | Library of free, high-quality UI kits, icon packs, and mockups |
| Open Doodles | A Free Set of Sketchy Illustrations |
| Avataaars | Free sketch library of avatars illustrations by Pablo Stanley |
| Blush | Free customizable illustrations with Figma Plugin |
| Hero Patterns | A collection of repeatable SVG background patterns |
| BEAUBUS Patterns | A set of 150+ free SVG patterns (backgrounds) |
| IsoFlat | A Free collection of Isometric SVG graphic resources |
| IRA Design | An open-source gradient illustrations collection by creative tim. |
| Transparent Textures | A collection of transparent textures background patterns. |
| icons8.com/illustrations | Vector illustrations to class up your project |
| Patternico | Seamless Pattern Maker |
| Freellustrations | Free Background Images for awesome landing Pages |
| Pixeltrue Illustrations | Free Animated Illustrations |
| Abstract User Avatar API | API to create simple yet flexible user avatars from user names or emails |
| sketchvalley | Download free PNG, SVG or AI file . |
| PatternPad | Free and unlimited unique pattern designs. |
| Dimensions | Dimensions.com is an ongoing reference database of dimensioned drawings documenting the standard measurements and sizes of the everyday objects and spaces |
| Freebiesbug | Hand-picked resources for web designers and developers, constantly updated. |
| Flexiple | One new high-quality, open-source illustration each day. |
| Cool Text | Cool Text is a FREE graphics generator for web pages and anywhere else you need an impressive logo without a lot of design work |
| illustration kit | Premium open source illustrations added daily |
| Doodad Pattern Generator | Create unique, seamless, royalty-free patterns. |
| Pattern Monster | A simple online pattern generator to create repeatable SVG patterns |
| Exemplar | Free Avatar Library for Figma and Sketch |
| UIBundle | Thousands of Free Design Resources like UI Kits, Mockups, Illustrations, Icons, Fonts, 3D assets, Templates and more. |
| openby.design | Custom crafted free UI design resources, for personal and commercial projects. No attribution is required. |
| Design Stripe | Create beautiful illustrations, no design skills needed. |
| HOLA SVG! | An SVG playground to share SVG stuff. |
| symu.co | Free templates, UI kits, icon, PSD |
| Mesh Gradient | Generate & download beautiful mesh gradients. |
| CSS Shadow Gradients | Generate CSS Gradients For Shadows. |
| Creatica | Generate unique beautiful and unique Backgrounds and patterns. |
| Boring Avatars | SVG random, cutely avatars collections |
| Html to Design | Convert any website into fully editable Figma designs |
| fffuel | collection of color tools and free SVG generators for gradients, patterns, textures, shapes & backgrounds |
Fonts
Websites that offer free fonts as well as font-based tools
| Website | Description |
|---|---|
| Google Fonts | Library of around 1000 free licensed font families |
| DaFont | Archive of freely downloadable fonts |
| Use & Modify | Personal selection of beautiful, classy, punk, professional, incomplete, weird typefaces |
| 1001 Free Fonts | I think the name speaks for itself :smirk: |
| Font Squirrel | Font Squirrel scours the internet for high quality, legitimately free fonts |
| Font Fabric | A digital type foundry crafting retail fonts and custom typography for various brands |
| Tiff | A type diff tool that visually contrasts the differences between two fonts |
| TypeKit Practice | Learn about typography practices |
| Fontjoy | Generate font pairing in one click |
| Golden Ratio | Golden Ratio Typography Calculator |
| FontGet | Has a variety of fonts available to download and sorted neatly with tags |
| FontPair | Helps you pair Google Fonts together |
| Font Space | A designer-centered free font website that has quick customizable previews |
| Abstract Fonts | Fonts free for personal and commercial use |
| Free Typography | A list of high quality fonts |
| Leon Sans | A geometric sans-serif typeface made with code |
| Lexend | A variable font empirically shown to significantly improve reading-proficiency |
| Fonts for Apple Platforms | Get the details, frameworks, and tools you need to use system fonts for Apple platforms in your apps |
| SFWin | San Francisco Fonts for Windows 10 and non-Apple Platform |
| Font Flipper | Preview 800+ Google Fonts on top of your own designs, without having to download the fonts |
| Fonts Arena | Free curated fonts |
| Befonts | High quality fonts for free |
| Arabic fonts | Arabic fonts for free |
| FontDrop | Simple and easy way to view the contents of font files |
| Open Foundry | FREE platform for curated open-source typefaces |
| Glyphter | Upload your own SVGS and turn them into font files. Useful if you want a smaller library loaded |
| Google Webfonts Helper | A Hassle-Free Way to Self-Host Google Fonts |
| Rough Font Awesome | When RoughJS meets Font Awesome |
| FFonts | Stylish fonts for free |
| Malayalam Fonts | Malayalam fonts for free which are maintained by Swathanthra Malayalam Computing(SMC) |
| Dev Fonts | Find and use the coding fonts for free |
| Font M | Free font you can download for material coding and design |
| W Fonts | Download Free fonts |
| Modern fluid typography editor | Fluid typography is a modern way of approaching responsive typography. |
| UrbanFonts | A collection of over 8000 free fonts and dingbats |
| Typespiration | Inspirational font combinations and color palettes |
| Fontsource | Self-host Open Source fonts in neatly bundled NPM packages. |
| FontBolt | Discover and generate your favorite fonts from pop culture. |
| Fontshare | Fontshare is a free fonts service from the Indian Type Foundry (ITF), making quality fonts accessible to all. |
Colors
Websites and resources that help with choices related to colors
| Website | Description |
|---|---|
| Colorlab | Create color palette, gradients, color scales, check contrast all in one place. |
| Color Brewer 2 | The original color palette generator, also supporting color blindness. Probably the scientifically best option. Also probably not the prettiest. |
| Huetone | A tool to create accessible color systems. |
| Colormind.io | Color palette generator |
| ColorCurves.app | Color palette generator that uses curves to generate color palettes |
| ColorGradient | A free tool to create simple and complex CSS Gradients visually |
| Coolors | Create the perfect palette or get inspired by thousands of beautiful color schemes |
| UI Colors | Tailwind CSS color palette generator |
| HTML Color Codes | Get HTML color codes, Hex color codes, RGB and HSL values with our color picker, color chart and HTML color names |
| Colors & Fonts | A curated library of colors, fonts and resources |
| Palette List | Pick 2 colors you like and the tool generates thousands of palettes for you. |
| Google Material Color Tool | Official Google Material Color Palette Tool |
| Material Palette | Free to pick palettes, icons and colors for Material Design |
| ColorSpace | Generate nice color palettes from one color |
| FlatUIColors | Beautiful set of color palettes in various flavors |
| Adobe Color | Create color palettes, extract gradients from images, etc. |
| Colorsinspo | All-in-one resource for finding everything about colors |
| ColorsWall | Place to store your color palettes and generate palette in one click |
| Happyhues | Happy 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 | Discover current color trends in different industries from the creative communities on Behance and Adobe Stock |
| Color Hunt | A free and open platform for color inspiration with thousands of trendy hand-picked color palettes |
| Gradient Hunt | A free and open platform for gradient inspiration with thousands of trendy hand-picked color gradients |
| Web Gradients | A free website to find good CSS gradients |
| ColorBox | A free website to produce color set |
| CSS gradient | A free website to make custom gradient and some examples of gradient |
| gradienta | A pure css and jpg gradients |
| UI Gradients | UI gradients color generator |
| Palette Generator | Generate new color palette with every spacebar press |
| Material Palettes | 1000+ Material Design palettes |
| Grabient | Gradient Selector |
| ShadeSwash | Quickly generate shades of any color |
| BrandColors | The biggest collection of official brand color codes |
| BRAND PALETTES | Logo Color Codes and Palettes |
| Material Design Palette Generator | Generate theme and color palette Material Design-like |
| Colorate | Color scheme tool for designers and developers. This will help you draw inspiration and serve as a resource for your color work. |
| 0to255 | A color tool that makes it easy to lighten and darken colors. It’s perfect for hover states, borders, gradients, and more. |
| [Color |
编辑推荐精选
Keevx
AI数字人视频创作平台
Keevx 一款开箱即用的AI数字人视频创作平台，广泛适用于电商广告、企业培训与社媒宣传，让全球企业与个人创作者无需拍摄剪辑，就能快速生成多语言、高质量的专业视频。
即梦AI
一站式AI创作平台
提供 AI 驱动的图片、视频生成及数字人等功能，助力创意创作
扣子-AI办公
AI办公助手，复杂任务高效处理
AI办公助手，复杂任务高效处理。办公效率低？扣子空间AI助手支持播客生成、PPT制作、网页开发及报告写作，覆盖科研、商业、舆情等领域的专家Agent 7x24小时响应，生活工作无缝切换，提升50%效率！
TRAE编程
AI辅助编程，代码自动修复
Trae是一种自适应的集成开发环境（IDE），通过自动化和多元协作改变开发流程。利用Trae ，团队能够更快速、精确地编写和部署代码，从而提高编程效率和项目交付速度。Trae具备上下文感知和代码自动完成功能，是提升开发效率的理想工具。
AI工具TraeAI IDE协作生产力转型热门
蛙蛙写作
AI小说写作助手，一站式润色、改写、扩写
蛙蛙写作—国内先进的AI写作平台，涵盖小说、学术、社交媒体等多场景。提供续写、改写、润色等功能，助力创作者高效优化写作流程。界面简洁,功能全面,适合各类写作者提升内容品质和工作效率。
AI辅助写作AI工具蛙蛙写作AI写作工具学术助手办公助手营销助手AI助手
问小白
全能AI智能助手，随时解答生活与工作的多样问题
问小白，由元石科技研发的AI智能助手，快速准确地解答各种生活和工作问题，包括但不限于搜索、规划和社交互动，帮助用户在日常生活中提高效率，轻松管理个人事务。
热门AI助手AI对话AI工具聊天机器人
Transly
实时语音翻译/同声传译工具
Transly是一个多场景的AI大语言模型驱动的同声传译、专业翻译助手，它拥有超精准的音频识别翻译能力，几乎零延迟的使用体验和支持多国语言可以让你带它走遍全球，无论你是留学生、商务人士、韩剧美剧爱好者，还是出国游玩、多国会议、跨国追星等等，都可以满足你所有需要同传的场景需求，线上线下通用，扫除语言障碍，让全世界的语言交流不再有国界。
讯飞智文
一键生成PPT和Word，让学习生活更轻松
讯飞智文是一个利用 AI 技术的项目，能够帮助用户生成 PPT 以及各类文档。无论是商业领域的市场分析报告、年度目标制定，还是学生群体的职业生涯规划、实习避坑指南，亦或是活动策划、旅游攻略等内容，它都能提供支持，帮助用户 精准表达，轻松呈现各种信息。
AI办公办公工具AI工具讯飞智文AI在线生成PPTAI撰写助手多语种文档生成AI自动配图热门
讯飞星火
深度推理能力全新升 级，全面对标OpenAI o1
科大讯飞的星火大模型，支持语言理解、知识问答和文本创作等多功能，适用于多种文件和业务场景，提升办公和日常生活的效率。讯飞星火是一个提供丰富智能服务的平台，涵盖科技资讯、图像创作、写作辅助、编程解答、科研文献解读等功能，能为不同需求的用户提供便捷高效的帮助，助力用户轻松获取信息、解决问题，满足多样化使用场景。
热门AI开发模型训练AI工具讯飞星火大模型智能问答内容创作多语种支持智慧生活
Spark-TTS
一种基于大语言模型的高效单流解耦语音令牌文本到语音合成模型
Spark-TTS 是一个基于 PyTorch 的开源文本到语音合成项目，由多个知名机构联合参与。该项目提供了高效的 LLM（大语言模型）驱动的语音合成方案，支持语音克隆和语音创建功能，可通过命令行界面（CLI）和 Web UI 两种方式使用。用户可以根据需求调整语音的性别、音高、速度等参数，生成高质量的语音。该项目适用于多种场景，如有声读物制作、智能语音助手开发等。
下拉加载更多
推荐工具精选
AI云服务特惠
懂AI专属折扣关注微信公众号
最新AI工具、AI资讯
独家AI资源、AI项目落地
微信扫一扫 关注公众号