Designeer

实时收录422 个工具17 个分区132 位设计师

设计与前端工具， 精心挑选。

UI 组件库、动画工具、AI 编程助手、图标集与设计灵感画廊——为用代码做设计的人而建。 悬停任意画框即可预览动效，按 Space.

60fps.design
60fps preview
60fps
figma.com
Figma preview
Figma
refactoringui.com
Refactoring UI preview
Refactoring UI
forgeui.in
ForgeUI preview
ForgeUI
motion.dev
Motion preview
Motion
claude.com
Claude Code preview
Claude Code
drayhq.com
Dray preview
Dray
vercel.com
Vercel preview
Vercel
fontshare.com
Fontshare preview
Fontshare
oklch.com
OKLCH preview
OKLCH
threejs.org
Three.js preview
Three.js
thebookofshaders.com
Book of Shaders preview
Book of Shaders
lucide.dev
Lucide preview
Lucide
svgomg.net
SVGOMG preview
SVGOMG
raycast.com
Raycast preview
Raycast
screen.studio
Screen Studio preview
Screen Studio
tldraw.com
tldraw preview
tldraw
cosmos.so
Cosmos preview
Cosmos
framer.com
Framer preview
Framer
practicaltypography.com
Practical Typography preview
Practical Typography
rewampui.com
RewampUI preview
RewampUI
gsap.com
GSAP preview
GSAP
cursor.com
Cursor preview
Cursor
styles.refero.design
Refero preview
Refero
developers.cloudflare.com
Cloudflare preview
Cloudflare
klim.co.nz
Klim preview
Klim
color.review
Color.review preview
Color.review
r3f.docs.pmnd.rs
React Three Fiber preview
React Three Fiber
compute.toys
compute.toys preview
compute.toys
phosphoricons.com
Phosphor preview
Phosphor
regexr.com
RegExr preview
RegExr
ghostty.org
Ghostty preview
Ghostty
remotion.dev
Remotion preview
Remotion
excalidraw.com
Excalidraw preview
Excalidraw
curated.design
Curated Design preview
Curated Design
make.design
make.design preview
make.design

422 个工具 · 17 个分区 · 5 个大类

完整目录

全部工具，按大类和分区归纳。边输入边筛选，或从左侧图层栏跳到某个分区。

422 个工具

设计灵感

进入大类

网页设计灵感画廊

78分区页
60fps.design
60fps preview
60fps灵感画廊收集界面动态效果的屏幕录屏，供学习 UI 动画时参考。
awwwards.com
awwwards.com
Awwwards灵感画廊每日评选并展示优秀网页设计与前端作品的奖项与画廊。
cosmos.so
Cosmos preview
Cosmos灵感画廊用于收集图片与参考、搭建创意灵感画板的可视化 moodboard 空间。
curated.design
Curated Design preview
Curated Design灵感画廊按视觉风格归类网站灵感，让你按想要的样子浏览的画廊。
layers.to
Layers preview
Layers灵感画廊设计师公开发布与分享作品、获取反馈和灵感的平台。
minimal.gallery
Minimal Gallery preview
Minimal Gallery灵感画廊收录极简克制网站的合集，适合寻找简约设计灵感。
mobbin.com
Mobbin preview
Mobbin灵感画廊可搜索的真实移动端与网页应用界面及用户流程库，取自已上线产品。
saaspo.com
Saaspo preview
Saaspo灵感画廊精选 SaaS 落地页画廊，提供营销与产品设计灵感。
seesaw.website
SEESAW preview
SEESAW灵感画廊按页面区块整理的网站设计灵感，可逐块研究。
supahero.io
Supahero preview
Supahero灵感画廊精选网站 hero 区合集，为设计落地页提供灵感。
imageory.in
Imageory preview
Imageory灵感画廊将图片与其背后 prompt 一并呈现的视觉画廊，激发创意灵感。
backgrounds.supply
Backgrounds Supply preview
Backgrounds Supply灵感画廊一组手工制作的网站背景，可直接用到你的下个项目中。
backgrounds.venust.ai
Venust Backgrounds preview
Venust Backgrounds灵感画廊免费的 AI 生成网站背景，并附上生成时所用的原始 prompt。
details.so
Details preview
Details灵感画廊对一流数字产品微交互的细节拆解，供深入研究。
sombra.design
Sombra preview
Sombra灵感画廊展示深色模式网站界面，适合围绕暗色调做设计的人。
dribbble.com
Dribbble preview
Dribbble灵感画廊设计师发布作品与概念、分享交流并寻找灵感的全球社区。
behance.net
Behance preview
Behance灵感画廊Adobe 旗下发布与浏览各设计领域创意作品集的平台。
recent.design
Recent Design preview
Recent Design灵感画廊每周精选堪获大奖的网站，持续输送设计灵感。
navbar.design
navbar.design preview
navbar.design灵感画廊精选导航栏范例，供设计网站菜单时参考。
footer.design
footer.design preview
footer.design灵感画廊精选的创意网站页脚合集，为收尾区块提供灵感。
land-book.com
Land-book preview
Land-book灵感画廊按行业整理的大型落地页画廊，可浏览你所在领域的设计。
collectui.com
Collect UI preview
Collect UI灵感画廊按组件打标签的每日 UI 设计灵感，来自持续进行的设计挑战。
siteinspire.com
SiteInspire preview
SiteInspire灵感画廊长期运营的精致网页设计展示，可按风格与主题筛选。
lapa.ninja
Lapa Ninja preview
Lapa Ninja灵感画廊精选响应式落地页合集，供浏览获取布局灵感。
uxarchive.com
UX Archive preview
UX Archive灵感画廊逐屏记录移动端引导流程的归档，供 UX 参考。
screenlane.com
Screenlane preview
Screenlane灵感画廊可搜索的界面截图画廊，提供跨应用的 UI 灵感。
flowbase.co
Flowbase preview
Flowbase灵感画廊提供优质 UI 组件与交互范例的资源，用于搭建网站布局。
hoverstat.es
Hover States preview
Hover States灵感画廊展示富有创意的交互式网页设计，供研究网站如何处理动效与悬停。
saasframe.io
SaaSFrame preview
SaaSFrame灵感画廊收录数百张 SaaS 营销页截图，作为落地页设计灵感。
landingfolio.com
Landingfolio preview
Landingfolio灵感画廊海量落地页设计库，供浏览获取布局与营销灵感。
pttrns.com
Pttrns preview
Pttrns灵感画廊移动端 UI 范例目录，可参考应用如何处理常见界面。
onepagelove.com
One Page Love preview
One Page Love灵感画廊展示单页网站设计，适合正在做单页网站的人。
designspiration.com
Designspiration preview
Designspiration灵感画廊用于发现视觉艺术与设计图像、激发灵感的搜索平台。
bestwebsite.gallery
Best Website Gallery preview
Best Website Gallery灵感画廊精选优秀网站的归档，作为出色网页设计的参考。
theinspirationgrid.com
Inspiration Grid preview
Inspiration Grid灵感画廊聚焦各领域创意视觉设计与作品的在线杂志。
scrnshts.club
Scrnshts preview
Scrnshts灵感画廊精选 App Store 截图设计合集，为移动应用营销提供灵感。
are.na
Are.na preview
Are.na灵感画廊用于视觉收藏、把资料整理进共享画板的协作平台。
appinspo.com
Appinspo preview
Appinspo灵感画廊经严选的移动应用设计画廊，提供 UI 与界面灵感。
darkmodedesign.com
Dark Mode Design preview
Dark Mode Design灵感画廊专注深色模式网站的展示，为设计暗色界面提供灵感。
pinterest.com
Pinterest preview
Pinterest灵感画廊用于保存与发现各类创意灵感的视觉发现平台。
navbar.gallery
navbar.gallery preview
navbar.gallery灵感画廊专注现代导航栏的画廊，供设计网站菜单时研究。
posts.design
posts.design preview
posts.design灵感画廊精选社交媒体平面设计归档，为帖子与信息流排版提供灵感。
loadmo.re
loadmo.re preview
loadmo.re灵感画廊展示实验性移动端网站设计的画廊，带来新颖、突破边界的灵感。
inspora.design
inspora.design preview
inspora.design灵感画廊当代视觉网页设计的归档，供浏览获取现代灵感。
cta.gallery
cta.gallery preview
cta.gallery灵感画廊精选 call-to-action 按钮与横幅合集，提供以转化为目标的灵感。
desengs.com
desengs.com preview
desengs.com灵感画廊汇集 design engineering 作品集及其背后创作者故事的目录。
isthereanytool.app
isthereanytool preview
isthereanytool灵感画廊发掘设计、创作与 AI 工作中冷门工具的目录。
designeng.tools
designeng.tools preview
designeng.tools灵感画廊将 design engineering 工具、资源与灵感汇于一处的精选中心。
bestdesignsonx.com
bestdesignsonx.com preview
bestdesignsonx.com灵感画廊从 X 精选设计见长的创作者与亮眼帖子的信息流。
designbookmark.com
Design Bookmark preview
Design Bookmark灵感画廊收藏实用设计资源与链接的目录，让你在一处就能找到。
rebrand.gallery
Rebrand Gallery preview
Rebrand Gallery灵感画廊以改版前后对照展示品牌重塑的画廊，供研究品牌形象的演变。
curations.supply
Curations preview
Curations灵感画廊精选数字设计素材库，供浏览并取用到项目中。
landing.love
Landing Love preview
Landing Love灵感画廊按动效归类的精彩落地页合集，提供动效灵感。
motionimo.xyz
Motionimo preview
Motionimo灵感画廊海量动效设计片段库，供研究动画与运动。
before.click
before.click preview
before.click灵感画廊展示高转化应用截图创意，为 App Store 营销提供灵感。
swiped.design
Swiped preview
Swiped灵感画廊从各社交平台收集的亮眼设计帖子合集。
landdding.com
Landdding preview
Landdding灵感画廊每日更新的创意落地页目录，提供布局与营销灵感。
designengineer.tools
designengineer.tools preview
designengineer.tools灵感画廊为 design engineer 工作量身整理的必备工具合集。
insposite.com
Insposite preview
Insposite灵感画廊汇集设计参考与工具的目录，需要灵感时可随时浏览。
loader-buttons.appllama.io
Loader Buttons preview
Loader Buttons灵感画廊收录 25 个加载按钮动画的画廊，供参考微交互创意。
whatships.com
What Ships preview
What Ships灵感画廊从 X 帖子收集的亮眼产品发布演示视频合集。
greatstuff.fyi
GreatStuff preview
GreatStuff灵感画廊经精心筛选的创意工具归档，助你更快找到好用的那些。
greatapps.fyi
Great Apps preview
Great Apps灵感画廊每周精选值得细看的优秀 iOS 应用画廊。
curated.domains
Curated Domains preview
Curated Domains灵感画廊收录使用创意顶级域名的品牌合集，为命名与品牌提供灵感。
sections.wtf
Sections.wtf preview
Sections.wtf灵感画廊收录真实网站区块与 hero 布局的画廊，可逐块参考。
browse.cool
Browse.cool preview
Browse.cool灵感画廊精选以出色触感与交互著称的网站。
folios.gallery
Folios Gallery preview
Folios Gallery灵感画廊精选优秀设计师作品集目录，供学习与获取灵感。
wwwtf.site
wwwtf.site preview
wwwtf.site灵感画廊展示交互网络中古怪、实验性角落的画廊，值得一探。
early.tools
Early preview
Early灵感画廊发掘值得先睹为快的早期软件产品的发现平台。
openalternative.co
OpenAlternative preview
OpenAlternative灵感画廊为热门 SaaS 工具匹配开源替代品的目录。
everywhere.tools
Everywhere Tools preview
Everywhere Tools灵感画廊面向动手设计与创作的开源创意工具合集。
gallery.jessyin.world
Jessy In's Gallery preview
Jessy In's Gallery灵感画廊一个共享 moodboard，大家在这里收集各种新奇的视觉素材，激发设计灵感。
wallofportfolios.in
Wall of Portfolios preview
Wall of Portfolios灵感画廊汇集设计工程与产品作品集的展示墙，供你浏览找灵感。
detail.design
Detail Design preview
Detail Design灵感画廊收录各类软件界面中精心打磨的微交互案例的资料库。
betwnstudios.com
Betwn Studios preview
Betwn Studios灵感画廊一家为 SaaS 产品设计并打造现代化网页体验的工作室。
saaslandingpage.com
SaaS Landing Page preview
SaaS Landing Page灵感画廊精选值得研究的优秀 SaaS 落地页，供你参考取经。
bestsaaswebdesigns.com
Best SaaS Web Designs preview
Best SaaS Web Designs灵感画廊精心挑选的 SaaS 网站设计合集，作为设计灵感来源。
a1.gallery
A1 preview
A1灵感画廊汇集各类网站设计的画廊，为你的下一个项目提供灵感。

界面设计工具与 UI 实验室

11分区页
figma.com
Figma preview
Figma界面设计协作平台，与团队一起设计界面并制作原型。
framer.com
Framer preview
Framer界面设计可视化画布，设计网站后可直接发布到 web。
make.design
make.design preview
make.design界面设计AI 生成器，将文字 prompt 转化为精致的界面设计。
penpot.app
Penpot preview
Penpot界面设计开源 web 设计平台，以 SVG 为核心，在浏览器中运行。
spline.design
Spline preview
Spline界面设计基于浏览器的 3D 设计软件，内置物理引擎打造交互场景。
interfacecraft.dev
Interface Craft preview
Interface Craft界面设计一系列文章，探讨现代数字界面背后的工艺。
uilabs.dev
UI Labs preview
UI Labs界面设计一个实验室，拆解动效 UI 组件，展示其构建方式。
uiw.tf
UIWTF preview
UIWTF界面设计实验性界面范式的展示，探索 web 能力的边界。
lab01.dev
Lab01 preview
Lab01界面设计一家设计工作室发布的精致界面实验合集。
design.dev
design.dev preview
design.dev界面设计AI 辅助编辑器，用于构建与管理设计 token 及设计系统。
uiplaybook.dev
UI Playbook preview
UI Playbook界面设计一份指南，讲解 UI 组件在设计时会经历的常见状态。

网页设计资源：博客、书籍与课程

33分区页
refactoringui.com
Refactoring UI preview
Refactoring UI设计阅读一本实用指南，满是设计与构建更好界面的实战技巧。
practicaltypography.com
Practical Typography preview
Practical Typography设计阅读一本在线书籍，讲解排版规则以及如何排布文字。
web.dev
web.dev preview
web.dev设计阅读关于网页性能与遵循现代网页标准进行构建的实用指导。
inclusive-components.design
Inclusive Components preview
Inclusive Components设计阅读一个模式库，教你如何构建无障碍的界面组件。
joshwcomeau.com
Josh Comeau preview
Josh Comeau设计阅读互动式教程与文章，拆解 CSS 的机制究竟是如何运作的。
design-books.com
Design Books preview
Design Books设计阅读一个按学科门类整理的必读设计书籍目录。
learn-kernels.com
Learn Kernels preview
Learn Kernels设计阅读一份互动指南，带你编写并理解 GPU kernel 编程。
designsystemchecklist.com
Design System Checklist preview
Design System Checklist设计阅读一份详尽的清单，涵盖打造一套可投产的设计系统所需的方方面面。
learn-ui.com
Learn UI preview
Learn UI设计阅读一门视频课程，讲授设计用户界面的实战方法。
designspells.com
Design Spells preview
Design Spells设计阅读一个合集，剖析日常软件中那些不易察觉的设计细节。
goodui.org
Good UI preview
Good UI设计阅读一个以真实数据为依据、基于实证的 UI 设计模式库。
abduzeedo.com
Abduzeedo preview
Abduzeedo设计阅读一个每日更新的设计博客，持续分享视觉灵感。
uxdesign.cc
UX Collective preview
UX Collective设计阅读一份精选刊物，汇集关于用户体验设计的深度评论文章。
smashingmagazine.com
Smashing Magazine preview
Smashing Magazine设计阅读一个可靠的资源站，为网页设计师和开发者提供文章与指南。
tympanus.net
Codrops preview
Codrops设计阅读一个博客，发布富有创意的前端实验及其动手教程。
muz.li
Muzli preview
Muzli设计阅读一份每日精选摘要，把最新设计趋势汇聚成一个信息流。
boxesandarrows.com
Boxes and Arrows preview
Boxes and Arrows设计阅读一本长期运营的刊物，探讨信息架构的实践与理念。
designernews.co
designernews.co
Designer News设计阅读一个由社区驱动的信息流，设计师在此发现并讨论最新动态。
webdesignerdepot.com
Web Designer Depot preview
Web Designer Depot设计阅读一个设计刊物，涵盖网页标准以及设计师使用的工具。
designmodo.com
Designmodo preview
Designmodo设计阅读一个刊物，既提供文章，也提供网页设计的实用工具。
99designs.com
99designs Discover preview
99designs Discover设计阅读一个设计博客，探讨品牌以及其背后的创意思考。
interfaces.dev
Interfaces preview
Interfaces设计阅读一份每月更新的数字刊物，探讨数字界面的设计。
makingsoftware.com
Making Software preview
Making Software设计阅读一系列文章，探讨设计师使用的工具最终如何塑造了他们的软件。
visualrambling.space
Visual Rambling preview
Visual Rambling设计阅读个人化的视觉随笔，一次聚焦一个点深入探讨界面设计。
degreeless.design
Degreeless Design preview
Degreeless Design设计阅读一份精选的学习路线图，为立志精通产品设计的人而备。
svg.guide
SVG Guide preview
SVG Guide设计阅读一份面向设计师和开发者的指南，讲解如何编写并动画化 SVG。
animations.dev
Animations.dev preview
Animations.dev设计阅读一门课程，教你创作真正手感到位的网页动画。
ui-skills.com
UI Skills preview
UI Skills设计阅读一门课程，讲授借助 AI 来设计界面的各种技巧。
aiforui.dev
AI for UI preview
AI for UI设计阅读一门课程，讲解如何把 AI 工作流运用到界面设计流程中。
ui.land
UI Land preview
UI Land设计阅读一系列访谈，与顶尖设计工程师聊他们的手艺。
lawsofux.com
Laws of UX preview
Laws of UX设计阅读一套影响界面易用程度的心理学原则合集。
userinterface.wiki
User Interface Wiki preview
User Interface Wiki设计阅读一个知识库，将界面设计的准则与规范集中整理在一处。
shapeof.ai
The Shape of AI preview
The Shape of AI设计阅读一个模式库，聚焦于 AI 驱动界面的设计模式。

组件库

进入大类

React UI 组件库

109分区页
forgeui.in
ForgeUI preview
ForgeUI组件库带动效的 React 与 Tailwind 组件，还配有现成模板，帮你更快搭建界面。
rewampui.com
RewampUI preview
RewampUI组件库一个展示现成 UI 组件的面板，可随意浏览并复用。
ui.shadcn.com
shadcn/ui preview
shadcn/ui组件库直接复制进自己代码库的 UI 组件，而不是作为依赖包安装。
base-ui.com
Base UI preview
Base UI组件库由 Radix 与 MUI 团队打造的无样式、可自由定制的组件基元。
radix-ui.com
Radix preview
Radix组件库无障碍、无样式的 UI 基元，搭建 React 界面时可自由定制样式。
21st.dev
21st.dev preview
21st.dev组件库社区版 shadcn 组件库，可先交互式预览再添加组件。
motion-primitives.com
Motion Primitives preview
Motion Primitives组件库基于 Motion 库打造的动效 React 组件，为界面增添动感。
reactbits.dev
React Bits preview
React Bits组件库一组富有创意的动效组件，可直接用到 React 项目中。
component.gallery
Component Gallery preview
Component Gallery组件库汇集并对比不同设计系统组件的参考资料库。
number-flow.barvian.me
NumberFlow preview
NumberFlow组件库平滑呈现数字变化动画的组件，兼容各主流框架。
fancycomponents.dev
Fancy Components preview
Fancy Components组件库运用物理效果打造的趣味 React 组件，让交互更生动。
opensourceui.in
Opensource UI preview
Opensource UI组件库可直接复制粘贴到项目里的 React UI 组件和设备样机。
ui.spectrumhq.in
Spectrum UI preview
Spectrum UI组件库专为搭建 SaaS 网站设计的精致 UI 组件。
amicro.vercel.app
Amicro preview
Amicro组件库轻量、即插即用的基元，为 React 界面添加微动画。
painterly.design-tools.workers.dev
Painterly preview
Painterly组件库基于 canvas 的艺术化加载动画，封装成 React 组件。
bencho.dev
Bencho preview
Bencho组件库可交互的 UI 模块，物理参数可调，精确调出想要的手感。
shadcnblocks.com
shadcnblocks preview
shadcnblocks组件库数千个 shadcn 风格、简洁即用的网站模块。
blocks.so
blocks.so preview
blocks.so组件库开源网站模块，可直接通过命令行安装。
8bitcn.com
8bitcn preview
8bitcn组件库复古 8-bit 风格的 UI 组件，可直接用到 shadcn 项目中。
evilcharts.com
Evil Charts preview
Evil Charts组件库带动效的 SVG 图表组件，能完美融入 shadcn/ui 项目。
coss.com
coss ui preview
coss ui组件库基于 Base UI 基元库打造、可复制粘贴的 UI 组件。
rareui.com
Rare UI preview
Rare UI组件库一组独具特色的动效 UI 组件，用于搭建 React 界面。
beui.dev
beUI preview
beUI组件库用 Tailwind CSS 设计样式的动效 React 组件，加快界面开发。
butter-nav.vercel.app
Butter Nav preview
Butter Nav组件库一款大型菜单组件，在不同板块间切换时布局会流畅变形。
cult-ui.com
Cult UI preview
Cult UI组件库由 Framer Motion 驱动的动效 React 组件，带来流畅的界面动画。
daisyui.com
daisyUI preview
daisyUI组件库一套扩展 Tailwind CSS 的组件类库，让样式编写更快。
heroui.com
HeroUI preview
HeroUI组件库一个现代化的 React UI 组件库，早期曾以 NextUI 之名发布。
kibo-ui.com
Kibo UI preview
Kibo UI组件库一个组件库，内含专为搭建 AI 界面定制的组件。
magicui.design
Magic UI preview
Magic UI组件库专为搭建落地页打造的动效 UI 组件。
ui.aceternity.com
Aceternity UI preview
Aceternity UI组件库潮流的动效组件与 hero 区块，用于打造吸睛的网页。
animate-ui.com
Animate UI preview
Animate UI组件库借助 Motion 动画库注入活力的无障碍 shadcn 组件。
flyonui.com
FlyonUI preview
FlyonUI组件库语义化的 Tailwind CSS 组件，可直接搭配最新的 Tailwind v4 使用。
tailgrids.com
TailGrids preview
TailGrids组件库响应式 UI 模块，助你用 Tailwind CSS 快速拼搭页面。
flowbite.com
Flowbite preview
Flowbite组件库一个基于 Tailwind CSS 的大型组件库，用于界面开发。
hyperui.dev
HyperUI preview
HyperUI组件库免费开源的 UI 组件，可复制到你的 Tailwind CSS 项目中。
preline.co
Preline UI preview
Preline UI组件库适合搭建复杂仪表盘界面的 Tailwind CSS 组件。
floatui.com
Float UI preview
Float UI组件库专为营销网站拼搭页面打造的 Tailwind CSS 组件。
merakiui.com
Meraki UI preview
Meraki UI组件库内置从右到左语言支持的 Tailwind CSS 组件。
tremor.so
Tremor preview
Tremor组件库一套模块化的 React 组件，用于拼搭完整的仪表盘界面。
headlessui.com
Headless UI preview
Headless UI组件库由 Tailwind Labs 团队打造的无样式、无障碍 UI 组件。
basecn.dev
Base CN preview
Base CN组件库将 Base UI 基元重新封装，以融入 shadcn 组件工作流。
easyui.pro
Easy UI preview
Easy UI组件库一个可复制粘贴的组件库，帮你快速拼搭界面。
eldoraui.site
Eldora UI preview
Eldora UI组件库专为快速搭建网页落地页定制的动效 UI 组件。
velora.colorlib.com
Velora UI preview
Velora UI组件库一套免费的 Tailwind CSS 组件和预制页面区块，可随取随用。
watermelon.sh
Watermelon UI preview
Watermelon UI组件库一个为融入 shadcn 工具生态而打造的 React 组件库。
beautifului.dev
Beautiful UI preview
Beautiful UI组件库精致、可复制粘贴的 UI 组件，用于搭建 Web 应用前端。
hexter-ui.com
hexter-ui.com
Hexter UI组件库一套整洁简约的组件合集，可直接用到 shadcn 项目中。
lightswind.com
Lightswind preview
Lightswind组件库带光照与辉光效果的 Tailwind CSS 组件，打造吸睛的 UI。
reverseui.com
Reverse UI preview
Reverse UI组件库一个用 React 和 Tailwind CSS 搭建界面的组件库。
smoothui.dev
Smooth UI preview
Smooth UI组件库动效丰富的 React 组件，可直接复制到你自己的项目中。
tailark.com
Tailark preview
Tailark组件库面向营销网站搭建的 Tailwind CSS 页面区块与组件。
ui-layouts.com
UI Layouts preview
UI Layouts组件库整页布局与 hero 区块，可用 Tailwind CSS 直接拼搭。
kokonutui.com
Kokonut UI preview
Kokonut UI组件库富有创意的可交互 UI 组件，以 shadcn 格式封装使用。
nexui.dev
Nex UI preview
Nex UI组件库一个可扩展的 UI 组件库，面向打造现代创业产品的团队。
ninna-ui.dev
Ninja UI preview
Ninja UI组件库轻量级 UI 组件，助力网站保持轻快、加载迅速。
seraui.com
Sera UI preview
Sera UI组件库可通过 shadcn 命令行工具直接安装的 React 组件。
reui.io
Re UI preview
Re UI组件库基于 Base UI 基元库打造的无障碍 UI 组件。
syntaxui.com
Syntax UI preview
Syntax UI组件库带动效、可复制粘贴的 UI 组件，用于快速拼搭落地页。
shadcn-cssinjs.com
shadcn-cssinjs preview
shadcn-cssinjs组件库经过改造的 shadcn 组件，适配采用 CSS-in-JS 样式方案的项目。
transitions.dev
Transitions preview
Transitions组件库精选的 CSS 过渡方案与缓动曲线合集，可随取随用。
23rd.dev
23rd preview
23rd组件库shadcn 风格的组件，React 和 Svelte 项目均可使用。
oneko.dhrv.pw
Oneko preview
Oneko组件库一只像素风小猫，会在页面上跟着你的光标跑来跑去。
rolling.kitlangton.dev
Rolling Number preview
Rolling Number组件库一个 React 数字计数器，数字变化时带有平滑的滚动动画。
annnimate.com
Annnimate preview
Annnimate组件库用 GSAP 动画库打造、可直接用于生产环境的动效组件。
getlayers.ai
GetLayers preview
GetLayers组件库一组 AI 提示词，为你的网站生成电影质感的页面区块。
scrit.to
Scritto preview
Scritto组件库提供字符滚动文字过渡效果的组件库，可直接嵌入你的 UI。
ogimagecn.com
ogimagecn preview
ogimagecn组件库基于 Satori 生成 Open Graph 社交分享图的组件。
tripwire.sh
Dither Kit preview
Dither Kit组件库用抖动像素渲染的图表组件，营造复古怀旧的视觉风格。
shieldcn.dev
shieldcn preview
shieldcn组件库契合 shadcn 风格的 README 徽章，用来美化你的项目文档。
ui.unlumen.com
unlumen UI preview
unlumen UI组件库极简风格的 React 组件库，通过命令行安装和添加。
bearnie.dev
Bearnie preview
Bearnie组件库专为 Astro 打造、用 Tailwind CSS 设计样式的 UI 组件集。
fluidfunctionalism.com
Fluid Functionalism preview
Fluid Functionalism组件库以基于物理、目的明确的动画驱动运动的 UI 组件。
termcn.dev
termcn preview
termcn组件库基于 Ink 和 OpenTUI、用于构建终端风格界面的 React 组件。
framecn.dev
framecn preview
framecn组件库基于 Editframe，为 React 项目提供程序化视频渲染。
emailcn.run
emailcn preview
emailcn组件库兼容 React Email、MJML 和 JSX Email 的响应式邮件组件。
startercn.vercel.app
startercn preview
startercn组件库可直接 fork 的 shadcn/ui registry 启动模板，内置文档、落地页和 agent 支持。
pdfcn.dev
pdfcn preview
pdfcn组件库基于 Takumi 和 Forme、用于生成 PDF 文档的 React 组件。
editorcn.vercel.app
editorcn preview
editorcn组件库基于 Tiptap 框架、可直接嵌入 React 应用的富文本编辑 UI。
shadcn-labs.com
Shadcn Labs preview
Shadcn Labs组件库面向 shadcn/ui 生态的开源 registry 与工具合集。
frameblox.com
frameblox.com
Frameblox组件库模块化区块和模板，可在 Framer 中拼装成完整网站。
ui.nexvyn.dev
ui.nexvyn.dev
Nexvyn UI组件库精致、可直接嵌入数字界面和应用的 UI 组件。
gradient-spin.vercel.app
gradient-spin.vercel.app
Gradient Spin组件库为 React 项目提供的渐变旋转加载指示器组件。
libraries.dev
Libraries.dev preview
Libraries.dev组件库专为 AI agent 使用而设计的 UI 效果与组件合集。
sonaui.com
Sona UI preview
Sona UI组件库可复制进代码库的动画 React 组件，完全归你所有、可自由改样式。
text-effects.colorion.co
Colorion Text Effects preview
Colorion Text Effects组件库可直接复制粘贴到界面中的动画文字效果。
dotmatrix.zzzzshawn.cloud
Dot Matrix preview
Dot Matrix组件库为 shadcn 项目打造的五十多款点阵风格加载动画。
sacred.computer
SRCL preview
SRCL组件库重现复古 DOS 时代终端界面外观的组件套件。
prompt-kit.com
Prompt Kit preview
Prompt Kit组件库用于构建聊天及其他 AI 界面体验的基础组件。
shoogle.dev
Shoogle preview
Shoogle组件库索引众多 shadcn registry 中 UI 组件的搜索引擎。
interior.dev
interior.dev preview
interior.dev组件库精心调校的微交互，点击瞬间就有灵敏的反馈感。
soundcn.xyz
soundcn preview
soundcn组件库可复制粘贴的 UI 音效合集，为界面添加声音。
cuelume.dev
cuelume preview
cuelume组件库用浏览器 Web Audio API 实时生成的微型界面音效提示。
canvasui.dev
Canvas UI preview
Canvas UI组件库GPU 加速的液体物理效果与 canvas 着色器，带来丰富的 UI 视觉。
odysseyui.com
Odyssey UI preview
Odyssey UI组件库构建于 shadcn 组件体系之上的一套动画 React 组件。
spell.sh
Spell UI preview
Spell UI组件库精心打造的交互式 UI 组件，用于构建现代 Web 应用。
skiper-ui.com
Skiper UI preview
Skiper UI组件库可用 Tailwind CSS 组合与设计样式的动画 UI 基础组件。
devl.dev
devl preview
devl组件库极简、实验性的 UI 组件，用于构建现代 Web 界面。
uiuno.com
Uiuno preview
Uiuno组件库借助 AI 整理和管理 shadcn 组件的工作空间。
vengeanceui.com
Vengeance UI preview
Vengeance UI组件库围绕滚动驱动交互与效果打造的动画 React 组件。
sensory-ui.com
sensory-ui preview
sensory-ui组件库为 shadcn/ui 组件添加音频反馈的声音设计系统。
amacro.vercel.app
Amacro preview
Amacro组件库可直接嵌入的页面进场动画，几乎无需配置即可加入 React 应用。
evilbuttons.com
Evil Buttons preview
Evil Buttons组件库精心打造的按钮组件，按下瞬间就有交互感与触感。
componentry.dev
Componentry preview
Componentry组件库可定制的 UI 基础组件，用于构建 React 界面。
great-ui.com
Great UI preview
Great UI组件库用 React 构建、Tailwind CSS 设计样式的可复制粘贴组件。
ui.ruru.build
Ruru UI preview
Ruru UI组件库无障碍、可定制的 UI 组件，用于构建 React 应用。
shadcnstudio.com
Shadcn Studio preview
Shadcn Studio组件库包含 shadcn/ui 组件、预制区块和完整模板的库。
shadcn-animated.vercel.app
Animated shadcn/ui preview
Animated shadcn/ui组件库由 Motion 驱动的标准 shadcn/ui 组件动画版本，用于打造动画界面。
pinui.xyz
Pin UI preview
Pin UI组件库用 React 和 Tailwind CSS 构建、风格独特的可复制粘贴组件。
loading.dev
loading.dev preview
loading.dev组件库为 React 应用提供的轻量加载指示器与加载动画库。

React 与 Web 动画库

11分区页
motion.dev
Motion preview
Motion动画库生产级动画库，为 web 上的 React 应用添加动效。
gsap.com
GSAP preview
GSAP动画库业界广泛使用的 JavaScript 动画引擎，以时间轴为核心。
rive.app
Rive preview
Rive动画库用状态机驱动、构建交互式矢量动画的工具。
lottiefiles.com
Lottie preview
Lottie动画库轻量的、基于 JSON 的格式，用于向 web 交付矢量动画。
easingwizard.com
Easing Wizard preview
Easing Wizard动画库可视化生成器，为 web 动画定制 CSS 弹簧缓动曲线。
morphrig.dev
Morphrig preview
Morphrig动画库交互式手册，逐步讲解图标形变动画的原理。
theatrejs.com
Theatre.js preview
Theatre.js动画库可视化时序编排工具，用于编排 DOM 元素的动效设计。
morphicons.com
morphicons preview
morphicons动画库动画库，用弹簧物理让图标形变，实现自然的动效。
glimm.dev
glimm preview
glimm动画库由 shader 驱动的页面过渡，为 Next.js 项目的导航添加动画。
devouringdetails.com
Devouring Details preview
Devouring Details动画库交互式电子书，讲授微交互设计的工艺。
textmotion.dev
textmotion preview
textmotion动画库零依赖的基础组件，为 web 添加滚动文字动画。

开发工具

进入大类

AI 代码编辑器与开发者工具

24分区页
claude.com
Claude Code preview
Claude Code开发者工具直接在命令行终端中运行的 agentic 编程助手。
cursor.com
Cursor preview
Cursor开发者工具AI 优先的代码编辑器，旨在加速软件的编写与交付。
zed.dev
Zed preview
Zed开发者工具高性能代码编辑器，专为低延迟、灵敏的编辑体验而打造。
v0.app
v0 preview
v0开发者工具将纯文本提示词转化为可用 shadcn/ui 代码的生成式 AI 工具。
bolt.new
Bolt.new preview
Bolt.new开发者工具在浏览器中构建和运行全栈应用的沙盒环境。
vite.dev
Vite preview
Vite开发者工具面向现代 Web 项目的快速前端构建工具与开发服务器。
biomejs.dev
Biome preview
Biome开发者工具用 Rust 编写的快速代码格式化与 lint 工具，面向 Web 开发项目。
playwright.dev
Playwright preview
Playwright开发者工具自动化浏览器、运行可靠端到端测试套件的框架。
buildertools.sh
BuilderTools preview
BuilderTools开发者工具一套专注的开发者工具，帮助你更快地交付软件。
nuqs.47ng.com
nuqs preview
nuqs开发者工具读写类型安全 URL 查询参数的 React 库。
better-t-stack.dev
Better T Stack preview
Better T Stack开发者工具用命令行脚手架搭建现代全栈 TypeScript 项目的工具。
github.com
AI Stack preview
AI Stack开发者工具对比构建 AI 应用所用现代技术栈的目录。
alumnium.ai
Alumnium preview
Alumnium开发者工具用自然语言编写端到端测试，通过 MCP 提供。
vercel-doctor.com
Vercel Doctor preview
Vercel Doctor开发者工具精准定位 Next.js 应用性能瓶颈的诊断工具。
ossperks.com
OSS Perks preview
OSS Perks开发者工具为开源项目维护者汇集免费云额度与福利的平台。
vinext.dev
Vinext preview
Vinext开发者工具让你在 Cloudflare 上构建和运行 Next.js 应用的 Vite 插件。
evlog.dev
evlog preview
evlog开发者工具用于在 Web 应用中捕获事件的结构化日志框架。
audio.raphaelsalaja.com
@web-kits/audio preview
@web-kits/audio开发者工具在 Web 应用中声明式添加和控制声音的库。
nuejs.org
Nue preview
Nue开发者工具轻量级 Web 框架，定位为更精简的 React 替代方案。
umami.is
Umami preview
Umami开发者工具注重隐私的 Web 分析工具，无需 cookie 同意横幅即可使用。
torph.lochie.me
Torph preview
Torph开发者工具零依赖的文字变形过渡动画库。
x.ai
x.ai/bot preview
x.ai/bot开发者工具详细说明 xAI 网络爬虫规范的文档。
tracwell.app
Tracwell preview
Tracwell开发者工具专注追踪网站访客与转化的分析工具。
dialkit.dev
DialKit preview
DialKit开发者工具应用内悬浮工具栏，让你在操作时实时调节参数。

AI 编程 Agent 与 MCP 服务器

35分区页
drayhq.com
Dray preview
DrayAgent 与 MCP统一的桌面工作空间，用于运行和管理多个编程 agent。
styles.refero.design
Refero preview
ReferoAgent 与 MCP结构化的 DESIGN.MD 规范文件，指导 AI agent 进行设计。
designmd.me
designmd.me preview
designmd.meAgent 与 MCP生成机器可读的设计规范，供 AI 编码 agent 解析并据此构建。
open-design.ai
Open Design preview
Open DesignAgent 与 MCP将设计系统打包成标准化格式，供 AI agent 读取并应用。
designmd.supply
designmd.supply preview
designmd.supplyAgent 与 MCP一套 DESIGN.MD 模板库，引导 AI 助手遵循你预期的外观与规则。
getdesign.md
getdesign.md preview
getdesign.mdAgent 与 MCP交互式生成器，为 AI 编码 agent 制定可遵循的设计规则。
design-md.hyperbrowser.ai
Hyperbrowser Design.md preview
Hyperbrowser Design.mdAgent 与 MCP直接从现有网站提取设计规则，生成 DESIGN.MD 文件。
aura.build
Aura preview
AuraAgent 与 MCP构建结构化的设计系统，为 AI agent 提供清晰的工作准则。
neuform.ai
Neuform preview
NeuformAgent 与 MCPAI 辅助的界面设计，将你的布局输出为干净可用的代码。
typeui.sh
typeui.sh preview
typeui.shAgent 与 MCP命令行工具，脚手架生成带类型的 UI 组件，让你从干净的配置起步。
webclaw.io
Webclaw preview
WebclawAgent 与 MCP将任意网页转换为干净、结构化的 markdown，便于 AI agent 读取。
ghostex.dev
Ghostex preview
GhostexAgent 与 MCP在一处同时运行并协调多个后台编码 agent 会话。
is-agentic.com
is-agentic.com preview
is-agentic.comAgent 与 MCP评估网站对爬虫与自动化 agent 的友好程度。
herdr.dev
Herdr preview
HerdrAgent 与 MCP分布式运行器，为你的编码 agent 管理并调度任务。
soubi.vercel.app
Soubi preview
SoubiAgent 与 MCP编译器，将 agent skill 定义转换为可用的构建产物。
agentcn.run
agentcn preview
agentcnAgent 与 MCP生产级、可定制的 AI agent 方案，可直接接入 React 项目。
skills.sh
skills preview
skillsAgent 与 MCP面向 shadcn registry 与日常开发流程打造的 agent skills。
mcpcn.dev
mcpcn preview
mcpcnAgent 与 MCP用于构建 ChatGPT、Claude 与 MCP 应用界面的 React UI 组件。
integrations.sh
integrations.sh preview
integrations.shAgent 与 MCP一个 API 集成规范仓库，供 AI agent 参考并据此构建。
fx.sh
fx preview
fxAgent 与 MCP用 Zig 编写的高性能编码 agent，通过命令行运行。
hyperframes.dev
HyperFrames preview
HyperFramesAgent 与 MCP无头引擎，无需可见浏览器即可将 HTML 渲染为 MP4 视频。
foglamp.dev
Foglamp preview
FoglampAgent 与 MCP可观测性工具，持续监控延迟与运行成本。
distill.id
Distill preview
DistillAgent 与 MCP一个 AI agent，将零散的研究笔记收集起来并整理成序。
agentation.com
Agentation preview
AgentationAgent 与 MCP将屏幕上的 UI 标注转化为 AI agent 可据此行动的上下文。
opencode.ai
OpenCode preview
OpenCodeAgent 与 MCP开源 AI 编码 agent，常驻终端、通过命令行工作。
impeccable.style
Impeccable preview
ImpeccableAgent 与 MCP一项设计智能 skill，让 AI agent 更懂什么是好的 UI。
skillsync.com
SkillSync preview
SkillSyncAgent 与 MCP让你的 agent 上下文在不同代码编辑器之间保持同步。
getbb.app
bb preview
bbAgent 与 MCP开源开发环境，专为运行与测试编码 agent 而打造。
capacity.so
Capacity preview
CapacityAgent 与 MCP自然语言工作区，将你的 prompt 转化为全栈应用。
lafys.com
Lafys preview
LafysAgent 与 MCPprompt 驱动的生成器，将朴素的描述转化为面向搭建者的 UI 组件。
efecto.app
Efecto preview
EfectoAgent 与 MCP以 agent 为先的可视化 web 画布，通过 MCP 接入已连接的工具。
arclabs.space
Arc labs preview
Arc labsAgent 与 MCPAI 求职工具套件，提供模拟技术面试助你练习。
scira.ai
Scira preview
SciraAgent 与 MCP精简的开源 AI 搜索引擎，用于在全网中查找答案。
kombai.com
Kombai preview
KombaiAgent 与 MCPAI 设计工程师，根据你给出的上下文编写 UI 代码。
causal.so
Causal preview
CausalAgent 与 MCPAI 驱动的画布工作区，用于记录笔记与梳理规划。

部署与托管平台

5分区页
vercel.com
Vercel preview
Vercel部署托管用于部署 Next.js 应用并将其发布到网上的云平台。
developers.cloudflare.com
Cloudflare preview
Cloudflare部署托管在全球边缘网络上运行无服务器 Workers 来部署应用。
netlify.com
Netlify preview
Netlify部署托管一个网站托管平台，通过持续部署流水线发布你的站点。
railway.app
Railway preview
Railway部署托管一个基础设施平台，让部署应用和数据库更简单。
fly.io
Fly.io preview
Fly.io部署托管将你的 Docker 容器运行在物理上靠近用户的服务器上。

设计素材

进入大类

面向 React 与 Web 的图标库

30分区页
lucide.dev
Lucide preview
Lucide图标库由社区维护的开源图标集，从 Feather 分支而来，提供数千个界面图标。
phosphoricons.com
Phosphor preview
Phosphor图标库灵活的图标家族，提供六种统一字重，适合界面设计。
iconify.design
Iconify preview
Iconify图标库统一的图标框架，让海量图标触手可及。
runeicons.com
Rune Icons preview
Rune Icons图标库极简图标集，提供五种不同风格供界面使用。
icon.museum
Icon Museum preview
Icon Museum图标库专门收藏优秀移动应用图标、致敬其设计工艺的档案库。
tabler.io
Tabler Icons preview
Tabler Icons图标库收录数千个线性风格图标的库，用于构建用户界面。
heroicons.com
Heroicons preview
Heroicons图标库由 Tailwind CSS 团队打造的手工 SVG 图标。
fonts.google.com
Material Symbols preview
Material Symbols图标库Google 推出的可变图标字体，提供三种可选风格用于界面。
icons.getbootstrap.com
Bootstrap Icons preview
Bootstrap Icons图标库官方 SVG 图标库，专为搭配 Bootstrap 框架而设计。
remixicon.com
Remix Icon preview
Remix Icon图标库风格中性的图标库，提供线性和填充两种版本。
iconoir.com
Iconoir preview
Iconoir图标库开源 SVG 图标集，笔画粗细统一一致。
ionic.io
Ionicons preview
Ionicons图标库精致的图标包，适用于网页和移动端界面。
simpleicons.org
Simple Icons preview
Simple Icons图标库收录 3000 多个热门品牌 logo 的图标集，均提供 SVG 格式。
thesvg.org
theSVG preview
theSVG图标库精选整洁、即用的品牌 logo 集，以 SVG 格式提供。
feathericons.com
Feather preview
Feather图标库极简开源图标集，每个图标都绘制在 24 像素网格上。
carbondesignsystem.com
Carbon Icons preview
Carbon Icons图标库IBM 官方图标库，专为打造企业级产品设计而生。
boxicons.com
Boxicons preview
Boxicons图标库一套矢量图标，提供三种不同视觉风格。
mx-icons.vercel.app
MX Icons preview
MX Icons图标库庞大且可定制的图标集，以 React 组件形式提供。
akveo.github.io
Eva Icons preview
Eva Icons图标库包含 400 个图标，提供线性和填充两种风格供界面使用。
devicon.dev
Devicon preview
Devicon图标库涵盖主流编程语言和开发者工具的图标集。
css.gg
css.gg preview
css.gg图标库700 个轻量图标，完全用纯 CSS 而非 SVG 绘制。
hugeicons.com
HugeIcons preview
HugeIcons图标库覆盖广泛的图标库，提供线性和实心两种风格。
reicon.dev
Reicon preview
Reicon图标库支持 tree-shaking 的 React 图标库，提供两种不同字重。
app.iconsax.io
Iconsax preview
Iconsax图标库用途广泛的图标集，提供六种不同视觉风格，适合 UI 工作。
icons0.dev
icons0 preview
icons0图标库图标搜索引擎，可在超过 20 万个图标中查找。
heroicons-animated.com
Heroicons Animated preview
Heroicons Animated图标库为 Heroicons 加入悬停触发动画的改版，适合交互式 UI。
icons.download
Icons.download preview
Icons.download图标库精选图标库，提供十六种不同美学风格供挑选。
lucide-animated.com
Lucide Animated preview
Lucide Animated图标库为 Lucide 图标集内置微动画的改版，让界面更生动。
iconfoundry.store
Icon Foundry preview
Icon Foundry图标库可搜索的图标档案库，汇聚了来自众多图标家族的图标。
inkword.app
Inkword preview
Inkword图标库输入一个单词，就能生成与之匹配的插画。

面向网站的字体与字体工具

7分区页
fontshare.com
Fontshare preview
Fontshare字体专业级字体库，可免费用于商业项目。
klim.co.nz
Klim preview
Klim字体字体工作室，设计可在 web 上使用的当代字体。
fontsource.org
Fontsource preview
Fontsource字体将开源字体作为 npm 包安装进项目，实现自托管。
wakamaifondue.com
Wakamai Fondue preview
Wakamai Fondue字体检查字体文件、揭示每款字体所支持特性的工具。
utopia.fyi
Utopia preview
Utopia字体流式排版计算器，输出可直接使用的 CSS clamp 值。
velvetyne.fr
Velvetyne preview
Velvetyne字体开源字体工作室，发布实验性、自由授权的字体。
departuremono.com
Departure Mono preview
Departure Mono字体像素风等宽字体，专为契合终端环境而设计。

面向界面设计的配色工具

5分区页
oklch.com
OKLCH preview
OKLCH配色基于感知均匀色彩空间的拾色器，用于挑选 UI 配色。
color.review
Color.review preview
Color.review配色对比度检查工具，帮你构建始终保持无障碍的配色方案。
huetone.ardov.me
Huetone preview
Huetone配色调色板生成器，平衡对比度以保证 UI 配色无障碍。
myndex.com
APCA preview
APCA配色现代对比度算法，贴合人眼对色彩的真实感知。
ramps.studio
Ramps preview
Ramps配色设计 token 工具，在 OKLCH 空间中生成平滑的色阶。

面向 Web 的 3D 工具与素材

6分区页
threejs.org
Three.js preview
Three.js3DJavaScript 库，借助 WebGL 在浏览器中创建并呈现 3D 图形。
r3f.docs.pmnd.rs
React Three Fiber preview
React Three Fiber3D声明式 React 渲染器，让你用组件的方式构建 Three.js 场景。
drei.docs.pmnd.rs
Drei preview
Drei3D一组现成的辅助组件，加速 React Three Fiber 项目的开发。
blender.org
Blender preview
Blender3D开源套件，用于 3D 建模、动画，以及为 web 渲染场景。
gltf.report
gltf.report preview
gltf.report3D在浏览器中检视并精简 glTF 资源，让 3D 模型在网页上加载更快。
polyhaven.com
Poly Haven preview
Poly Haven3D收录 CC0 授权贴图的公共素材库，可免费下载并用于任何项目。

WebGL 着色器与着色器渐变

7分区页
thebookofshaders.com
Book of Shaders preview
Book of Shaders着色器交互式实操教程，手把手教你一步步编写 fragment shader。
compute.toys
compute.toys preview
compute.toys着色器在线沙盒，用来编写和实验 WGSL compute shader。
shaderfrog.com
Shaderfrog preview
Shaderfrog着色器基于节点的可视化编辑器，通过连接图节点来构建 shader。
shadercn.run
shadercn preview
shadercn着色器可直接嵌入项目的 React shader 组件，基于 vgpu 与 TypeGPU 构建。
shaders.paper.design
Paper Shaders preview
Paper Shaders着色器零依赖、导入即用的 shader，适合用在你的网页项目中。
openshaders.com
OpenShaders preview
OpenShaders着色器开源的 WebGL shader 库，可直接嵌入你的网页项目。
orbkit.zzzzshawn.cloud
Orbkit preview
Orbkit着色器基于 WebGL 的渲染器，用于在浏览器中制作动态光球效果。

实用工具

进入大类

面向设计师与开发者的网页工具

34分区页
svgomg.net
SVGOMG preview
SVGOMG网页工具基于浏览器的图形化工具，用于优化和清理 SVG 文件。
regexr.com
RegExr preview
RegExr网页工具交互式演练场，可在浏览器中编写和测试正则表达式。
squoosh.app
Squoosh preview
Squoosh网页工具直接在浏览器中压缩图片，并左右对比压缩前后的效果。
fffuel.co
Fffuel preview
Fffuel网页工具基于浏览器的工具集，用于生成 SVG 纹理、渐变和背景图案。
ui.camera
ui.camera preview
ui.camera网页工具制作 3D 样机和场景，用于展示软件界面。
ray.so
Ray.so preview
Ray.so网页工具几步点击就能把代码片段变成精美、可分享的图片。
transform.tools
Transform preview
Transform网页工具多格式转换器，可把 JSON 和类型定义转换成其他代码。
playgrnd.tools
Playgrnd preview
Playgrnd网页工具一套创意工具，完全离线、直接在浏览器中运行。
tryanim8.com
Anim8 preview
Anim8网页工具把 MP4 录屏转换成轻量的 SVG 动画。
ogfolio.com
OGFolio preview
OGFolio网页工具预览并检查 Open Graph 社交卡片分享时的显示效果。
dotforge.vercel.app
DotForge preview
DotForge网页工具实时生成抖动（dither）效果，可直接用到你的网页项目中。
asciinator.app
ASCIInator preview
ASCIInator网页工具无需离开浏览器就能把图片转换成 ASCII 字符画。
vessa.design
Vessa preview
Vessa网页工具把品牌规范发布为可供团队分享的在线网页。
icoon.co
Icoon preview
Icoon网页工具AI 驱动的工具，可按需生成定制的三维图标。
designminis.com
Design Minis preview
Design Minis网页工具把各种小型设计工具和比例生成器汇聚于一处。
ascii.krackeddevs.com
ASCII (Kracked Devs) preview
ASCII (Kracked Devs)网页工具直接在浏览器中快速把纯文本转换成风格化的 ASCII 字符画。
literate-enigma-snowy.vercel.app
Dither Lab preview
Dither Lab网页工具为照片添加复古风格抖动滤镜的工具。
usehallmark.com
Hallmark preview
Hallmark网页工具落地页生成器，产出看起来像手工打造的页面设计。
tooooools.app
Tooooools preview
Tooooools网页工具一套基于浏览器的工具，用于给图片做抖动和像素化处理。
screan.app
Screan preview
Screan网页工具制作 App Store 宣传截图样机，用来展示你的应用。
postspark.app
PostSpark preview
PostSpark网页工具为截图配上简洁背景，专为社交分享而设计。
drawably.dev
Drawably preview
Drawably网页工具绘图工具，可生成手绘风格的图形用于用户界面。
mesurer.dev
Mesurer preview
Mesurer网页工具屏幕标尺，用于在实际网站上测量和检查像素间距。
render-labs.evlog.cloud
render-labs.evlog.cloud
Render Labs网页工具由 evlog 团队打造的图像渲染工具，面向设计师和开发者。
butterfly.so
Butterfly preview
Butterfly网页工具精简的落地页生成器，用于快速验证产品想法。
corne.rs
Corne preview
Corne网页工具关于 Corne 分体键盘的文档与参考资料。
shiori.sh
Shiori preview
Shiori网页工具可从命令行使用、并能与 Raycast 集成的书签管理器。
opensource-together.com
Open Source Together preview
Open Source Together网页工具把开发者与可参与贡献的开源项目连接起来的平台。
asciistudio.space
ASCII Studio preview
ASCII Studio网页工具基于浏览器的工作室，可把图片和视频都转换成 ASCII 字符画。
tabbied.com
Tabbied preview
Tabbied网页工具生成式工具，用于创作几何图案并导出为 SVG。
studio.rynix.in
Rynix Studio preview
Rynix Studio网页工具演练场，用于实验应用在视频上的实时视觉效果。
mascofast.com
Mascofast preview
Mascofast网页工具AI 工具，可创作带透明背景的 3D 动画吉祥物。
screenshot-studio.com
Screenshot Studio preview
Screenshot Studio网页工具将平面截图包裹进逼真的 3D 样机，是面向设计师和开发者的实用浏览器工具。
letsreplay.co
Replay preview
Replay网页工具录制真实访客的会话，让你回放用户实际是如何使用你网站的。

面向设计师与开发者的桌面应用

12分区页
raycast.com
Raycast preview
Raycast桌面应用可扩展的 Mac 启动器，能运行命令和搜索，用来替代 Spotlight。
ghostty.org
Ghostty preview
Ghostty桌面应用为速度打造的 GPU 加速终端模拟器，面向命令行开发者。
warp.dev
Warp preview
Warp桌面应用用 Rust 编写的终端，将命令输出归整成块，并加入 AI 辅助。
cleanshot.com
CleanShot X preview
CleanShot X桌面应用一款 Mac 桌面工具，集截图与录屏于一身。
granola.ai
Granola preview
Granola桌面应用一款 AI 记事本，无需派机器人进入会议就能整理出会议纪要。
localsend.org
LocalSend preview
LocalSend桌面应用通过本地 Wi-Fi 网络在附近设备间安全传输文件。
rioterm.com
Canario preview
Canario桌面应用一款将命令行会话分隔到不同窗格中的终端。
cooldock.app
CoolDock preview
CoolDock桌面应用一个辅助桌面 Dock，可在应用旁边放置监控小组件。
supaste.com
Supaste preview
Supaste桌面应用一款 Mac 应用，管理你的剪贴板并保留过往截图的历史记录。
runey.app
Runey preview
Runey桌面应用帮助自由职业者开具发票并在一个应用里管理客户。
revone.app
Revone preview
Revone桌面应用将各个工具中的支付数据汇集到一个营收仪表盘里。
zen-browser.app
Zen Browser preview
Zen Browser桌面应用一款 Firefox 分支，加入了垂直标签页和精简专注的界面。

屏幕录制与视频工具

11分区页
screen.studio
Screen Studio preview
Screen Studio屏幕录制一款录屏工具，能自动为画面加入平滑的镜头缩放。
remotion.dev
Remotion preview
Remotion屏幕录制让你用 React 组件以编程方式构建并渲染视频。
blackmagicdesign.com
DaVinci Resolve preview
DaVinci Resolve屏幕录制一款专业软件，在同一流程中将视频剪辑与调色结合起来。
descript.com
Descript preview
Descript屏幕录制一款 AI 视频编辑器，通过编辑文字稿来剪辑画面。
gif.ski
Gifski preview
Gifski屏幕录制将视频转换成高画质 GIF，并保留原始帧率。
slantit.app
Slant It preview
Slant It屏幕录制把平面的屏幕截图变成带倾斜角度的立体样机。
remocn.dev
Remocn preview
Remocn屏幕录制现成的 Remotion 动画组件，可直接用于视频制作。
bettershot.site
BetterShot preview
BetterShot屏幕录制一款录屏工具，为录制内容加入光标缩放和字幕。
recordly.dev
Recordly preview
Recordly屏幕录制一款录屏工具，用于制作精致的开发者演示。
cursorful.com
Cursorful preview
Cursorful屏幕录制一款录屏工具，录制时会自动追踪你的光标。
tokokino.com
Tokokino preview
Tokokino屏幕录制在这款基于浏览器的编辑器里，直接把截图嵌进设备样机中。

白板与草图工具

4分区页
tldraw.com
tldraw preview
tldraw白板一块无限画布白板，可通过其 React SDK 嵌入到你自己的应用中。
excalidraw.com
Excalidraw preview
Excalidraw白板一款协作式在线白板，所有内容都以手绘草图风格呈现。
obsidian.md
Obsidian preview
Obsidian白板本地优先的 Markdown 知识库，将你的笔记串联成可视化的关系图。
linear.app
Linear preview
Linear白板围绕速度打造的项目管理软件，用于规划与追踪工作。

精选合集

围绕人们真正会搜索的问题整理的细分清单，均从完整目录中挑选。

值得关注的设计师

这些设计工程师的作品集、开源项目与文章，正在塑造界面被构建的方式。

全部 132 位设计师
emilkowal.ski
Emil Kowalski preview
Emil Kowalski设计工程师以打造 Sonner、Vaul 以及一系列界面动画作品而为人所知。
rauno.me
Rauno Freiberg preview
Rauno Freiberg设计工程师撰写了 Vercel 的 Interaction Guidelines。
paco.me
Paco Coursey preview
Paco Coursey设计工程师以打造 cmdk 和 next-themes 项目而为人所知。
nelson.co
Gavin Nelson preview
Gavin Nelson设计工程师OpenAI 的设计师，专注打造富有质感的界面。
nerdy.dev
Adam Argyle preview
Adam Argyle设计工程师就职于 Chrome 开发者关系团队，推动 CSS 向前发展。
sarahdrasner.com
Sarah Drasner preview
Sarah Drasner设计工程师一位工程负责人，同时也撰写有关 Web 动画的文章。
jhey.dev
Jhey Tompkins preview
Jhey Tompkins设计工程师一位创意开发者，以充满趣味的 CSS 实验而闻名。
lynnandtonic.com
Lynn Fisher preview
Lynn Fisher设计工程师Single Div 项目背后的设计师。

做了值得收录的东西？

把链接发给我们。如果适合某个分区，就会获得一段预览录制和专属展示位。

提交工具
Designeer — 设计灵感、UI 组件库与开发工具