[
  {
    "id": "beautiful-ui-thinking",
    "name": "Beautiful UI · Thinking",
    "url": "https://www.beautifului.dev/#thinking-state",
    "category": "ai",
    "summary": "AI Thinking 状态、步骤跟踪与展开式界面示例。适合研究 AI 助手如何清晰表达处理状态。",
    "tags": [
      "Thinking",
      "Loading",
      "Agent UI"
    ],
    "notes": "值得参考的是 Thinking、Task Rows、Approval Card 的信息层级和反馈节奏。",
    "prompt": "为 AI 助手设计可展开的 Thinking / Task 状态界面，显示当前步骤和结果摘要，支持减少动画设置，参考 Beautiful UI 的信息层次。",
    "createdAt": "2026-10-10",
    "featured": true,
    "subcategory": "思考与状态",
    "kind": "灵感参考",
    "preview": "thinking",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "assistant-ui",
    "name": "assistant-ui",
    "url": "https://www.assistant-ui.com/",
    "category": "ai",
    "summary": "可组合的 AI 对话前端组件与运行时；适合带工具调用的聊天产品。",
    "tags": [
      "Chat",
      "React",
      "Agent UI"
    ],
    "notes": "需要真正做 AI 助手时参考，不必在设计资源库自身引入。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "subcategory": "对话组件",
    "kind": "组件集合",
    "preview": "thinking",
    "install": "",
    "usage": "",
    "github": "https://github.com/assistant-ui/assistant-ui",
    "skill": "",
    "demo": ""
  },
  {
    "id": "ai-elements",
    "name": "AI Elements",
    "url": "https://elements.ai-sdk.dev/",
    "category": "ai",
    "summary": "基于 shadcn/ui 的 AI 应用组件，包括消息、推理、工具与状态等。",
    "tags": [
      "AI SDK",
      "Reasoning",
      "Chat"
    ],
    "notes": "基于 shadcn/ui，适合 AI 对话、推理展示与工具调用；需满足其官方先决条件。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "subcategory": "对话组件",
    "kind": "组件集合",
    "preview": "thinking",
    "install": "npx ai-elements@latest",
    "usage": "// 或通过 shadcn registry 添加：\nnpx shadcn@latest add https://elements.ai-sdk.dev/api/registry/all.json",
    "github": "https://github.com/vercel/ai-elements",
    "skill": "",
    "demo": ""
  },
  {
    "id": "motion-scroll",
    "name": "Motion · Scroll Animations",
    "url": "https://motion.dev/docs/react-scroll-animations",
    "category": "motion",
    "summary": "Scroll-triggered、Scroll-linked 与 Parallax 的官方实现指南。",
    "tags": [
      "Scroll",
      "Parallax",
      "React"
    ],
    "notes": "区分滚动触发和滚动联动；Sticky、Scroll Snap 可优先采用 CSS。",
    "prompt": "在 React 页面中使用 Motion 实现 Scroll-triggered 淡入、Scroll-linked 阅读进度与 Parallax，分别处理 prefers-reduced-motion。",
    "createdAt": "2026-10-10",
    "featured": true,
    "subcategory": "滚动交互",
    "kind": "可安装动效库",
    "preview": "scroll",
    "install": "npm install motion",
    "usage": "import { motion } from \"motion/react\";\n\n<motion.div initial={{ opacity: 0 }} whileInView={{ opacity: 1 }} />",
    "github": "https://github.com/motiondivision/motion",
    "skill": "",
    "demo": ""
  },
  {
    "id": "gsap-scroll",
    "name": "GSAP · Scroll",
    "url": "https://gsap.com/scroll/",
    "category": "motion",
    "summary": "ScrollTrigger 与滚动序列的动效参考，适合复杂时间轴。",
    "tags": [
      "Scroll",
      "Timeline",
      "GSAP"
    ],
    "notes": "复杂叙事型滚动页面可参考；普通小动画优先更轻的方案。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "subcategory": "滚动交互",
    "kind": "可安装动效库",
    "preview": "scroll",
    "install": "npm install gsap",
    "usage": "import gsap from \"gsap\";\nimport { ScrollTrigger } from \"gsap/ScrollTrigger\";\ngsap.registerPlugin(ScrollTrigger);",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "react-bits",
    "name": "React Bits",
    "url": "https://reactbits.dev/",
    "category": "motion",
    "summary": "可预览的 React 动态文字、背景和界面效果集合。",
    "tags": [
      "Animated Text",
      "Background",
      "React"
    ],
    "notes": "适合快速探索文本、背景与交互片段；实际引入时按单个组件的文档接入。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": true,
    "subcategory": "组件动效",
    "kind": "组件集合",
    "preview": "motion",
    "install": "",
    "usage": "",
    "github": "https://github.com/DavidHDev/react-bits",
    "skill": "",
    "demo": "https://reactbits.dev/"
  },
  {
    "id": "animata",
    "name": "Animata",
    "url": "https://animata.design/",
    "category": "motion",
    "summary": "偏向产品 UI 的 React 动画组件和交互细节。",
    "tags": [
      "Microinteraction",
      "React",
      "Components"
    ],
    "notes": "适合按钮反馈、卡片切换和细微动效参考。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "subcategory": "组件动效",
    "kind": "灵感参考",
    "preview": "motion",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "shadcn-ui",
    "name": "shadcn/ui",
    "url": "https://ui.shadcn.com/",
    "category": "components",
    "summary": "可复制进项目的 UI 组件与设计系统基础，适合 Next.js 和 Tailwind。",
    "tags": [
      "React",
      "Tailwind",
      "Forms"
    ],
    "notes": "作为结构基础使用；不要因组件多就全部装入项目。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": true,
    "subcategory": "组件库",
    "kind": "组件集合",
    "preview": "ui",
    "install": "npx shadcn@latest init",
    "usage": "npx shadcn@latest add button",
    "github": "https://github.com/shadcn-ui/ui",
    "skill": "",
    "demo": ""
  },
  {
    "id": "radix-primitives",
    "name": "Radix Primitives",
    "url": "https://www.radix-ui.com/primitives",
    "category": "components",
    "summary": "重视键盘和可访问性的无样式 UI 基础组件。",
    "tags": [
      "Accessibility",
      "Dialog",
      "Popover"
    ],
    "notes": "表单、弹窗和下拉菜单交互逻辑参考。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "subcategory": "无障碍基础",
    "kind": "可安装组件库",
    "preview": "ui",
    "install": "npm install @radix-ui/react-dialog",
    "usage": "import * as Dialog from \"@radix-ui/react-dialog\";",
    "github": "https://github.com/radix-ui/primitives",
    "skill": "",
    "demo": ""
  },
  {
    "id": "magic-ui",
    "name": "Magic UI",
    "url": "https://magicui.design/",
    "category": "components",
    "summary": "带动效的 React UI 组件、布局与展示效果。",
    "tags": [
      "Motion",
      "Hero",
      "Tailwind"
    ],
    "notes": "优先参考局部效果，不照搬整套营销页。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "subcategory": "营销组件",
    "kind": "组件集合",
    "preview": "motion",
    "install": "",
    "usage": "",
    "github": "https://github.com/magicuidesign/magicui",
    "skill": "",
    "demo": ""
  },
  {
    "id": "aceternity-ui",
    "name": "Aceternity UI",
    "url": "https://ui.aceternity.com/",
    "category": "components",
    "summary": "强调沉浸感、卡片特效和背景的 React/Tailwind UI 资源。",
    "tags": [
      "3D",
      "Cards",
      "Motion"
    ],
    "notes": "高视觉冲击适合展示页；使用时评估移动端性能。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "subcategory": "营销组件",
    "kind": "灵感参考",
    "preview": "landing",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "lucide",
    "name": "Lucide Icons",
    "url": "https://lucide.dev/",
    "category": "icons",
    "summary": "统一的开源线性图标，支持 SVG 与多个开发框架。",
    "tags": [
      "SVG",
      "Icons",
      "React"
    ],
    "notes": "图标风格统一；优先使用图标名称而非自行画图。",
    "prompt": "使用 Lucide 风格图标，保持线宽、尺寸、视觉中心统一；不要混搭多套线性图标。",
    "createdAt": "2026-10-10",
    "featured": true,
    "subcategory": "线性图标",
    "kind": "可安装图标库",
    "preview": "icons",
    "install": "npm install lucide-react",
    "usage": "import { ArrowRight, Search } from \"lucide-react\";\n\n<ArrowRight size={20} strokeWidth={1.75} />",
    "github": "https://github.com/lucide-icons/lucide",
    "skill": "",
    "demo": ""
  },
  {
    "id": "iconify",
    "name": "Iconify · 图标引擎",
    "url": "https://iconify.design/",
    "category": "icons",
    "summary": "聚合多个图标集的检索和开发工具。",
    "tags": [
      "Icons",
      "SVG",
      "Library"
    ],
    "notes": "官方图标引擎，React 应用可通过 @iconify/react 渲染所选图标。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "subcategory": "图标合集",
    "kind": "可安装图标库",
    "preview": "icons",
    "install": "npm install @iconify/react",
    "usage": "import { Icon } from \"@iconify/react\";\n\n<Icon icon=\"mdi:home\" width=\"24\" />",
    "github": "https://github.com/iconify/icon-sets",
    "skill": "",
    "demo": ""
  },
  {
    "id": "simple-icons",
    "name": "Simple Icons",
    "url": "https://simpleicons.org/",
    "category": "icons",
    "summary": "常见品牌的 SVG 图标集合，适合社交、技术栈和合作伙伴展示。",
    "tags": [
      "Brand",
      "SVG",
      "Logo"
    ],
    "notes": "品牌标识不可任意改形或混作官方授权。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "subcategory": "品牌图标",
    "kind": "图标素材",
    "preview": "brand",
    "install": "npm install simple-icons",
    "usage": "",
    "github": "https://github.com/simple-icons/simple-icons",
    "skill": "",
    "demo": ""
  },
  {
    "id": "undraw",
    "name": "unDraw",
    "url": "https://undraw.co/illustrations",
    "category": "icons",
    "summary": "可检索的插画资源，适合空状态、说明页和引导页。",
    "tags": [
      "Illustration",
      "Empty State",
      "SVG"
    ],
    "notes": "适合空状态搭配，但注意风格统一、不要滥用。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "subcategory": "插画素材",
    "kind": "灵感参考",
    "preview": "illustration",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "google-fonts",
    "name": "Google Fonts",
    "url": "https://fonts.google.com/",
    "category": "typography",
    "summary": "开放字体目录与预览工具，便于挑选界面中英文字体。",
    "tags": [
      "Fonts",
      "Typography",
      "Open Source"
    ],
    "notes": "筛选中文覆盖、字重和加载体积，避免只看英文字形。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "subcategory": "字体资源",
    "kind": "灵感参考",
    "preview": "type",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "fontsource",
    "name": "Fontsource",
    "url": "https://fontsource.org/",
    "category": "typography",
    "summary": "帮助在网站中自托管开源字体，便于版本固定和加载优化。",
    "tags": [
      "Fonts",
      "Self-host",
      "CSS"
    ],
    "notes": "考虑网页自托管字体时使用，核对字重和许可证。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "subcategory": "字体资源",
    "kind": "字体工具",
    "preview": "type",
    "install": "npm install @fontsource/inter",
    "usage": "import \"@fontsource/inter/400.css\";",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "typescale",
    "name": "Typescale",
    "url": "https://typescale.com/",
    "category": "typography",
    "summary": "通过字体比例和层级生成更连贯的排版尺度。",
    "tags": [
      "Type Scale",
      "Hierarchy",
      "CSS"
    ],
    "notes": "设计标题、正文、注释之间的稳定层级。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "subcategory": "字级工具",
    "kind": "灵感参考",
    "preview": "type",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "color-hunt",
    "name": "Color Hunt",
    "url": "https://colorhunt.co/",
    "category": "color",
    "summary": "配色方案与色板灵感集合，适合快速发现颜色组合。",
    "tags": [
      "Palette",
      "Color",
      "Inspiration"
    ],
    "notes": "灵感色板不是最终色彩规范；落地前检查对比度。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "subcategory": "配色灵感",
    "kind": "灵感参考",
    "preview": "color",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "coolors",
    "name": "Coolors",
    "url": "https://coolors.co/",
    "category": "color",
    "summary": "调色板生成与配色探索工具。",
    "tags": [
      "Palette",
      "Generator",
      "Brand"
    ],
    "notes": "确定主色后再挑辅助色，不要每页重新换配色。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "subcategory": "配色工具",
    "kind": "灵感参考",
    "preview": "color",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "mobbin",
    "name": "Mobbin",
    "url": "https://mobbin.com/",
    "category": "inspiration",
    "summary": "收集真实产品界面和用户流程的设计参考。",
    "tags": [
      "Product UI",
      "Mobile",
      "UX Flow"
    ],
    "notes": "优先观察完整操作流程，而不只是单张漂亮截图。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": true,
    "subcategory": "产品体验",
    "kind": "灵感参考",
    "preview": "mobile",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "awwwards",
    "name": "Awwwards",
    "url": "https://www.awwwards.com/",
    "category": "inspiration",
    "summary": "展示优秀网页的视觉实验与案例。",
    "tags": [
      "Showcase",
      "Website",
      "Creative"
    ],
    "notes": "偏创意与展示；参考后需重新评估可用性和加载成本。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "subcategory": "网站案例",
    "kind": "灵感参考",
    "preview": "landing",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "pageflows",
    "name": "Page Flows",
    "url": "https://pageflows.com/",
    "category": "inspiration",
    "summary": "按任务流程查看 App 和网页产品设计案例。",
    "tags": [
      "User Flow",
      "UX",
      "Mobile"
    ],
    "notes": "更适合研究注册、查找、决策和表单流程。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "subcategory": "交互流程",
    "kind": "灵感参考",
    "preview": "mobile",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "figma-community",
    "name": "Figma Community",
    "url": "https://www.figma.com/community",
    "category": "inspiration",
    "summary": "社区设计资源、UI Kit、原型文件与模板的发现入口。",
    "tags": [
      "Figma",
      "Templates",
      "Design"
    ],
    "notes": "使用模板需核对作者的授权及再分发限制。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "subcategory": "设计社区",
    "kind": "灵感参考",
    "preview": "ui",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "hunt-now",
    "name": "Hunt Now",
    "url": "https://www.hunt.now/",
    "category": "inspiration",
    "subcategory": "资源导航",
    "summary": "整合组件、图标、设计灵感与开发资源的发现目录；可按分类浏览，也支持描述需求后寻找适合的站点。",
    "tags": [
      "资源导航",
      "设计目录",
      "搜索",
      "灵感发现"
    ],
    "notes": "参考它的内容分类和搜索优先的发现体验；Design Vault 不复制其 AI 搜索能力，只借鉴信息架构。",
    "prompt": "设计一个资源收藏页面，采用搜索优先的结构，清晰展示主分类、子分类、标签，并保留资源说明与来源链接。",
    "createdAt": "2026-10-10",
    "featured": true,
    "kind": "灵感参考",
    "preview": "directory",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "gsap-flip",
    "name": "GSAP · Flip",
    "url": "https://gsap.com/docs/v3/Plugins/Flip/",
    "category": "motion",
    "subcategory": "布局转场",
    "summary": "GSAP 的 FLIP 动画插件，可在元素位置、尺寸和布局发生改变时实现连续顺滑的状态过渡。",
    "tags": [
      "FLIP",
      "布局转场",
      "GSAP",
      "状态切换"
    ],
    "notes": "适合卡片布局切换、图库展开、筛选前后元素平滑位移。",
    "prompt": "使用 GSAP Flip 实现卡片列表与详情布局之间的平滑转场：在 DOM 切换前 getState，完成布局更新后使用 Flip.from，保持元素连续性，并尊重 prefers-reduced-motion。",
    "createdAt": "2026-10-10",
    "featured": true,
    "kind": "可安装动效库",
    "preview": "flip",
    "install": "npm install gsap",
    "usage": "import gsap from \"gsap\";\nimport { Flip } from \"gsap/Flip\";\ngsap.registerPlugin(Flip);\n\nconst state = Flip.getState(\".card\");\ndocument.querySelector(\".grid\").classList.toggle(\"wide\");\nFlip.from(state, { duration: 0.6, ease: \"power1.inOut\" });",
    "github": "https://github.com/greensock/GSAP",
    "skill": "",
    "demo": ""
  },
  {
    "id": "iconify-sets",
    "name": "Iconify · Icon Sets",
    "url": "https://icon-sets.iconify.design/",
    "category": "icons",
    "subcategory": "图标合集",
    "summary": "按图标集搜索、查看样式和许可；各图标集有独立授权，不应一概视为同一种许可证。",
    "tags": [
      "Icon",
      "SVG",
      "Search"
    ],
    "kind": "图标导航",
    "preview": "icons",
    "install": "npm install @iconify/react",
    "usage": "import { Icon } from \"@iconify/react\";\n<Icon icon=\"lucide:alarm-clock\" />",
    "github": "",
    "skill": "",
    "demo": "",
    "notes": "适合按场景筛选不同风格的图标。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": true
  },
  {
    "id": "lobe-icons",
    "name": "LobeHub Icons",
    "url": "https://lobehub.com/icons",
    "category": "icons",
    "subcategory": "品牌图标",
    "summary": "AI 模型、供应商、应用品牌图标合集，支持 React 组件和静态资源。",
    "tags": [
      "AI",
      "Brand",
      "React"
    ],
    "kind": "可安装图标库",
    "preview": "brand",
    "install": "npm install @lobehub/icons",
    "usage": "import { Claude } from \"@lobehub/icons\";\n\n<Claude.Color size={40} />",
    "github": "https://github.com/lobehub/lobe-icons",
    "skill": "https://lobehub.com/icons/skill.md",
    "demo": "",
    "notes": "适合 AI 产品的模型选择器、品牌列表。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": true
  },
  {
    "id": "tabler-icons",
    "name": "Tabler Icons",
    "url": "https://tabler.io/icons",
    "category": "icons",
    "subcategory": "线性图标",
    "summary": "细节一致的 24px 图标体系，React 包提供可调整描边宽度的组件。",
    "tags": [
      "Icon",
      "SVG",
      "React"
    ],
    "kind": "可安装图标库",
    "preview": "icons",
    "install": "npm install @tabler/icons-react",
    "usage": "import { IconArrowLeft } from \"@tabler/icons-react\";\n\n<IconArrowLeft size={24} stroke={1.5} />",
    "github": "https://github.com/tabler/tabler-icons",
    "skill": "",
    "demo": "",
    "notes": "细节一致的 24px 图标体系，React 包提供可调整描边宽度的组件。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": true
  },
  {
    "id": "phosphor-icons",
    "name": "Phosphor Icons",
    "url": "https://phosphoricons.com/",
    "category": "icons",
    "subcategory": "线性图标",
    "summary": "同一图标提供多种粗细和双色权重，适合在不同 UI 密度中使用。",
    "tags": [
      "Icon",
      "React",
      "Duotone"
    ],
    "kind": "可安装图标库",
    "preview": "icons",
    "install": "npm install @phosphor-icons/react",
    "usage": "import { Heart } from \"@phosphor-icons/react\";\n\n<Heart weight=\"duotone\" size={24} />",
    "github": "https://github.com/phosphor-icons/react",
    "skill": "",
    "demo": "",
    "notes": "同一图标提供多种粗细和双色权重，适合在不同 UI 密度中使用。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "heroicons",
    "name": "Heroicons",
    "url": "https://heroicons.com/",
    "category": "icons",
    "subcategory": "线性图标",
    "summary": "Tailwind Labs 的 Outline / Solid 图标，常用于后台产品界面。",
    "tags": [
      "Icon",
      "React",
      "Tailwind"
    ],
    "kind": "可安装图标库",
    "preview": "icons",
    "install": "npm install @heroicons/react",
    "usage": "import { AcademicCapIcon } from \"@heroicons/react/24/outline\";",
    "github": "https://github.com/tailwindlabs/heroicons",
    "skill": "",
    "demo": "",
    "notes": "Tailwind Labs 的 Outline / Solid 图标，常用于后台产品界面。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "remixicon",
    "name": "Remix Icon",
    "url": "https://remixicon.com/",
    "category": "icons",
    "subcategory": "图标合集",
    "summary": "中性、多场景的开源图标体系，适合网页导航、提示和状态界面。",
    "tags": [
      "Icon",
      "SVG"
    ],
    "kind": "图标素材",
    "preview": "icons",
    "install": "npm install remixicon",
    "usage": "",
    "github": "https://github.com/Remix-Design/RemixIcon",
    "skill": "",
    "demo": "",
    "notes": "中性、多场景的开源图标体系，适合网页导航、提示和状态界面。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "iconoir",
    "name": "Iconoir",
    "url": "https://iconoir.com/",
    "category": "icons",
    "subcategory": "线性图标",
    "summary": "简洁统一的开源线性图标资源，包含 React 接入方式。",
    "tags": [
      "Icon",
      "SVG",
      "React"
    ],
    "kind": "可安装图标库",
    "preview": "icons",
    "install": "npm install iconoir-react",
    "usage": "",
    "github": "https://github.com/iconoir-icons/iconoir",
    "skill": "",
    "demo": "",
    "notes": "简洁统一的开源线性图标资源，包含 React 接入方式。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "hugeicons",
    "name": "Hugeicons · Free",
    "url": "https://hugeicons.com/",
    "category": "icons",
    "subcategory": "图标合集",
    "summary": "多种图标风格，官方 React 接入需 renderer 和图标包同时安装；注意免费与付费范围。",
    "tags": [
      "Icon",
      "React"
    ],
    "kind": "可安装图标库",
    "preview": "icons",
    "install": "npm install @hugeicons/react @hugeicons/core-free-icons",
    "usage": "import { HugeiconsIcon } from \"@hugeicons/react\";\nimport { Home01Icon } from \"@hugeicons/core-free-icons\";\n\n<HugeiconsIcon icon={Home01Icon} size={24} />",
    "github": "https://github.com/hugeicons/hugeicons",
    "skill": "",
    "demo": "",
    "notes": "多种图标风格，官方 React 接入需 renderer 和图标包同时安装；注意免费与付费范围。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "material-symbols",
    "name": "Material Symbols",
    "url": "https://fonts.google.com/icons",
    "category": "icons",
    "subcategory": "图标合集",
    "summary": "Google Material 图标的不同样式、填充和宽度选择。",
    "tags": [
      "Material",
      "Icon"
    ],
    "kind": "图标素材",
    "preview": "icons",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": "",
    "notes": "Google Material 图标的不同样式、填充和宽度选择。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "svg-repo",
    "name": "SVG Repo",
    "url": "https://www.svgrepo.com/",
    "category": "icons",
    "subcategory": "图标合集",
    "summary": "搜索与下载 SVG 素材，需逐项核对许可及适用场景。",
    "tags": [
      "SVG",
      "Search"
    ],
    "kind": "图标导航",
    "preview": "icons",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": "",
    "notes": "搜索与下载 SVG 素材，需逐项核对许可及适用场景。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "transitions-dev",
    "name": "Transitions.dev",
    "url": "https://transitions.dev/",
    "category": "motion",
    "subcategory": "组件动效",
    "summary": "带可交互预览的 CSS 转场合集，可复制片段、通过 CLI 安装，另提供 Coding Agent Skill。",
    "tags": [
      "CSS",
      "Transition",
      "Skill"
    ],
    "kind": "片段 + Skill",
    "preview": "flip",
    "install": "npx transitions-dev add card-resize\nnpx transitions-dev list",
    "usage": "/* 在终端运行安装命令后，按 CLI 提示导入生成的 CSS 片段。 */",
    "github": "https://github.com/Jakubantalik/transitions.dev",
    "skill": "npx skills add Jakubantalik/transitions.dev",
    "demo": "https://transitions.dev/",
    "notes": "部分动效或服务可能需付费；不要将整套库作为竞争性产品再分发。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": true
  },
  {
    "id": "react-modal-sheet",
    "name": "React Modal Sheet",
    "url": "https://github.com/Temzasse/react-modal-sheet",
    "category": "components",
    "subcategory": "交互组件",
    "summary": "React 移动端底部抽屉，支持拖拽、关闭、滚动和不同高度吸附点。",
    "tags": [
      "Modal",
      "Bottom Sheet",
      "Motion"
    ],
    "kind": "可安装组件库",
    "preview": "sheet",
    "install": "npm install react-modal-sheet motion",
    "usage": "import { useState } from \"react\";\nimport { Sheet } from \"react-modal-sheet\";\n\nexport default function BottomSheetDemo() {\n  const [open, setOpen] = useState(false);\n  return <>\n    <button onClick={() => setOpen(true)}>Open</button>\n    <Sheet isOpen={open} onClose={() => setOpen(false)}>\n      <Sheet.Container>\n        <Sheet.Header />\n        <Sheet.Content>Content</Sheet.Content>\n      </Sheet.Container>\n      <Sheet.Backdrop />\n    </Sheet>\n  </>;\n}",
    "github": "https://github.com/Temzasse/react-modal-sheet",
    "skill": "",
    "demo": "",
    "notes": "React 移动端底部抽屉，支持拖拽、关闭、滚动和不同高度吸附点。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": true
  },
  {
    "id": "image-card-stack",
    "name": "Dynamic Image Card Stack",
    "url": "https://github.com/mirayavandiepen/image-card-stack",
    "category": "motion",
    "subcategory": "组件动效",
    "summary": "基于 React + Motion 的卡片层叠与拖拽效果，参考代码而非发布的独立 npm 组件。",
    "tags": [
      "Cards",
      "Drag",
      "Motion"
    ],
    "kind": "源码案例",
    "preview": "stack",
    "install": "git clone https://github.com/mirayavandiepen/image-card-stack.git\ncd image-card-stack\nnpm install\nnpm run dev",
    "usage": "",
    "github": "https://github.com/mirayavandiepen/image-card-stack",
    "skill": "",
    "demo": "",
    "notes": "适合图片画廊、项目案例展示；需要根据业务自行移植。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": true
  },
  {
    "id": "auto-animate",
    "name": "AutoAnimate",
    "url": "https://auto-animate.formkit.com/",
    "category": "motion",
    "subcategory": "布局转场",
    "summary": "为列表插入、删除与排序提供轻量动画，适合基础交互。",
    "tags": [
      "List",
      "Animation"
    ],
    "kind": "可安装动效库",
    "preview": "flip",
    "install": "npm install @formkit/auto-animate",
    "usage": "import autoAnimate from \"@formkit/auto-animate\";\nautoAnimate(document.getElementById(\"list\"));",
    "github": "https://github.com/formkit/auto-animate",
    "skill": "",
    "demo": "",
    "notes": "为列表插入、删除与排序提供轻量动画，适合基础交互。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "lenis-scroll",
    "name": "Lenis",
    "url": "https://lenis.darkroom.engineering/",
    "category": "motion",
    "subcategory": "滚动交互",
    "summary": "面向精细滚动体验的平滑滚动工具，注意无障碍和滚动冲突。",
    "tags": [
      "Scroll",
      "Smooth"
    ],
    "kind": "可安装动效库",
    "preview": "scroll",
    "install": "npm install lenis",
    "usage": "import Lenis from \"lenis\";",
    "github": "https://github.com/darkroomengineering/lenis",
    "skill": "",
    "demo": "",
    "notes": "面向精细滚动体验的平滑滚动工具，注意无障碍和滚动冲突。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "motion-primitives",
    "name": "Motion Primitives",
    "url": "https://motion-primitives.com/",
    "category": "motion",
    "subcategory": "微交互",
    "summary": "面向 React 的精细交互动效片段，适合按钮、文本与状态切换。",
    "tags": [
      "Motion",
      "React"
    ],
    "kind": "组件集合",
    "preview": "motion",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": "",
    "notes": "面向 React 的精细交互动效片段，适合按钮、文本与状态切换。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "animate-ui",
    "name": "Animate UI",
    "url": "https://animate-ui.com/",
    "category": "motion",
    "subcategory": "组件动效",
    "summary": "动画优先的 React 组件与交互参考，关注组件完成度与一致性。",
    "tags": [
      "Shadcn",
      "Motion"
    ],
    "kind": "组件集合",
    "preview": "motion",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": "",
    "notes": "动画优先的 React 组件与交互参考，关注组件完成度与一致性。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "nextjs-animations-demo",
    "name": "Next.js Scroll Animations Demo",
    "url": "https://github.com/danielwuachin/nextjs-animations",
    "category": "inspiration",
    "subcategory": "交互流程",
    "summary": "通过 Next.js + Framer Motion 复刻滚动叙事，适合学习实现逻辑，README 声明部分素材归原品牌所有。",
    "tags": [
      "Scroll",
      "Next.js",
      "Demo"
    ],
    "kind": "学习案例",
    "preview": "landing",
    "install": "git clone https://github.com/danielwuachin/nextjs-animations.git\ncd nextjs-animations\nnpm install\nnpm run dev",
    "usage": "",
    "github": "https://github.com/danielwuachin/nextjs-animations",
    "skill": "",
    "demo": "https://nextjs-animations-ruddy.vercel.app/",
    "notes": "仅作为技术学习参考，勿直接商用复刻其品牌素材。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "21st-dev",
    "name": "21st.dev",
    "url": "https://21st.dev/",
    "category": "components",
    "subcategory": "组件库",
    "summary": "可搜索的社区 UI 组件合集，适合查找已有组件设计再按来源接入。",
    "tags": [
      "Community",
      "React",
      "UI"
    ],
    "kind": "组件社区",
    "preview": "ui",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": "",
    "notes": "可搜索的社区 UI 组件合集，适合查找已有组件设计再按来源接入。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": true
  },
  {
    "id": "origin-ui",
    "name": "Origin UI",
    "url": "https://originui.com/",
    "category": "components",
    "subcategory": "组件库",
    "summary": "大量实用输入框、按钮、表单和菜单模式，适合后台及产品页面。",
    "tags": [
      "Forms",
      "Tailwind",
      "React"
    ],
    "kind": "组件集合",
    "preview": "ui",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": "",
    "notes": "大量实用输入框、按钮、表单和菜单模式，适合后台及产品页面。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "kibo-ui",
    "name": "Kibo UI",
    "url": "https://www.kibo-ui.com/",
    "category": "components",
    "subcategory": "组件库",
    "summary": "基于常见 React UI 生态的补充组件，适合查找具体交互模式。",
    "tags": [
      "React",
      "Components"
    ],
    "kind": "组件集合",
    "preview": "ui",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": "",
    "notes": "基于常见 React UI 生态的补充组件，适合查找具体交互模式。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "park-ui",
    "name": "Park UI",
    "url": "https://park-ui.com/",
    "category": "components",
    "subcategory": "设计系统",
    "summary": "基于 Ark UI 的组件配方和设计系统参考。",
    "tags": [
      "Design System",
      "React"
    ],
    "kind": "组件集合",
    "preview": "ui",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": "",
    "notes": "基于 Ark UI 的组件配方和设计系统参考。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "daisyui",
    "name": "daisyUI",
    "url": "https://daisyui.com/",
    "category": "components",
    "subcategory": "组件库",
    "summary": "Tailwind CSS 组件主题和类名方案，适合快速搭建管理界面。",
    "tags": [
      "Tailwind",
      "CSS"
    ],
    "kind": "可安装组件库",
    "preview": "ui",
    "install": "npm install -D daisyui",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": "",
    "notes": "Tailwind CSS 组件主题和类名方案，适合快速搭建管理界面。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "fontshare",
    "name": "Fontshare",
    "url": "https://www.fontshare.com/",
    "category": "typography",
    "subcategory": "字体资源",
    "summary": "免费字体浏览，适合为落地页寻找更有识别度的拉丁字体。",
    "tags": [
      "Font",
      "Typography"
    ],
    "kind": "字体资源",
    "preview": "type",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": "",
    "notes": "免费字体浏览，适合为落地页寻找更有识别度的拉丁字体。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "bunny-fonts",
    "name": "Bunny Fonts",
    "url": "https://fonts.bunny.net/",
    "category": "typography",
    "subcategory": "字体资源",
    "summary": "重视隐私的字体 CDN 替代方案，可按需要引入对应 CSS。",
    "tags": [
      "Font",
      "Privacy"
    ],
    "kind": "字体工具",
    "preview": "type",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": "",
    "notes": "重视隐私的字体 CDN 替代方案，可按需要引入对应 CSS。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "realtime-colors",
    "name": "Realtime Colors",
    "url": "https://www.realtimecolors.com/",
    "category": "color",
    "subcategory": "配色工具",
    "summary": "在网页布局中实时查看背景、文字和强调色的组合。",
    "tags": [
      "Color",
      "Preview"
    ],
    "kind": "配色工具",
    "preview": "color",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": "",
    "notes": "在网页布局中实时查看背景、文字和强调色的组合。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "happy-hues",
    "name": "Happy Hues",
    "url": "https://www.happyhues.co/",
    "category": "color",
    "subcategory": "配色灵感",
    "summary": "用完整页面说明颜色如何组合，适合 UI 配色参考。",
    "tags": [
      "Color",
      "Palette"
    ],
    "kind": "配色参考",
    "preview": "color",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": "",
    "notes": "用完整页面说明颜色如何组合，适合 UI 配色参考。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "gradient-hunt",
    "name": "Gradient Hunt",
    "url": "https://gradienthunt.com/",
    "category": "color",
    "subcategory": "渐变纹理",
    "summary": "渐变配色浏览，适用于按钮、背景和营销页面。",
    "tags": [
      "Gradient",
      "Color"
    ],
    "kind": "配色参考",
    "preview": "color",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": "",
    "notes": "渐变配色浏览，适用于按钮、背景和营销页面。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "norrav",
    "name": "Norrav Landing Page",
    "url": "https://github.com/peyush-nuwal/norrav-landing-page",
    "category": "inspiration",
    "subcategory": "网站案例",
    "summary": "Next.js 创意工作室落地页项目：字体、滚动动效与摄影排版结合，作为整体案例参考。",
    "tags": [
      "Landing",
      "GSAP",
      "Next.js"
    ],
    "kind": "完整项目案例",
    "preview": "landing",
    "install": "git clone https://github.com/peyush-nuwal/norrav-landing-page.git\ncd norrav-landing-page\nnpm install\nnpm run dev",
    "usage": "",
    "github": "https://github.com/peyush-nuwal/norrav-landing-page",
    "skill": "",
    "demo": "https://norrav-landing-page.vercel.app/",
    "notes": "不是零依赖组件，应查看项目许可证和所用素材授权。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": true
  },
  {
    "id": "godly",
    "name": "Godly",
    "url": "https://godly.website/",
    "category": "inspiration",
    "subcategory": "网站案例",
    "summary": "精挑细选的网页参考，适合研究品牌表达、版式和首屏布局。",
    "tags": [
      "Website",
      "Inspiration"
    ],
    "kind": "网站案例",
    "preview": "landing",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": "",
    "notes": "精挑细选的网页参考，适合研究品牌表达、版式和首屏布局。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "lapa-ninja",
    "name": "Lapa Ninja",
    "url": "https://www.lapa.ninja/",
    "category": "inspiration",
    "subcategory": "网站案例",
    "summary": "营销落地页与 UI 截图导航，适合布局灵感检索。",
    "tags": [
      "Landing",
      "Gallery"
    ],
    "kind": "网站案例",
    "preview": "landing",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": "",
    "notes": "营销落地页与 UI 截图导航，适合布局灵感检索。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "land-book",
    "name": "Land-book",
    "url": "https://land-book.com/",
    "category": "inspiration",
    "subcategory": "网站案例",
    "summary": "优质网站设计目录，可筛选行业及视觉风格。",
    "tags": [
      "Website",
      "Gallery"
    ],
    "kind": "网站案例",
    "preview": "landing",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": "",
    "notes": "优质网站设计目录，可筛选行业及视觉风格。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "saas-landing",
    "name": "SaaS Landing Page",
    "url": "https://saaslandingpage.com/",
    "category": "inspiration",
    "subcategory": "网站案例",
    "summary": "SaaS 营销页面灵感展示，适合研究信息层级与转化型布局。",
    "tags": [
      "SaaS",
      "Landing"
    ],
    "kind": "网站案例",
    "preview": "landing",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": "",
    "notes": "SaaS 营销页面灵感展示，适合研究信息层级与转化型布局。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "skills-sh",
    "name": "Skills.sh",
    "url": "https://skills.sh/",
    "category": "workflow",
    "subcategory": "Agent Skills",
    "summary": "发现、安装和复用 AI Coding Agent 技能的目录，具体 skill 应查看作者和权限。",
    "tags": [
      "Skill",
      "AI Agent"
    ],
    "kind": "技能目录",
    "preview": "terminal",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": "",
    "notes": "发现、安装和复用 AI Coding Agent 技能的目录，具体 skill 应查看作者和权限。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "anthropic-skills",
    "name": "Anthropic Skills",
    "url": "https://github.com/anthropics/skills",
    "category": "workflow",
    "subcategory": "Agent Skills",
    "summary": "公开的 Agent Skill 示例集合，可学习目录与 SKILL.md 结构。",
    "tags": [
      "Skill",
      "GitHub"
    ],
    "kind": "技能示例",
    "preview": "terminal",
    "install": "",
    "usage": "",
    "github": "https://github.com/anthropics/skills",
    "skill": "",
    "demo": "",
    "notes": "公开的 Agent Skill 示例集合，可学习目录与 SKILL.md 结构。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "vercel-agent-skills",
    "name": "Vercel Agent Skills",
    "url": "https://github.com/vercel-labs/agent-skills",
    "category": "workflow",
    "subcategory": "Agent Skills",
    "summary": "面向前端体验的代理技能参考；安装前先阅读仓库文档。",
    "tags": [
      "Skill",
      "Frontend"
    ],
    "kind": "技能示例",
    "preview": "terminal",
    "install": "",
    "usage": "",
    "github": "https://github.com/vercel-labs/agent-skills",
    "skill": "",
    "demo": "",
    "notes": "面向前端体验的代理技能参考；安装前先阅读仓库文档。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "motion-docs",
    "name": "Motion API 文档",
    "url": "https://motion.dev/docs/react",
    "category": "workflow",
    "subcategory": "开发文档",
    "summary": "React 动效 API、手势和滚动指南索引；建议以官方文档为准。",
    "tags": [
      "Motion",
      "React",
      "Docs"
    ],
    "kind": "开发文档",
    "preview": "terminal",
    "install": "npm install motion",
    "usage": "import { motion } from \"motion/react\";",
    "github": "https://github.com/motiondivision/motion",
    "skill": "",
    "demo": "",
    "notes": "React 动效 API、手势和滚动指南索引；建议以官方文档为准。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "gsap-docs",
    "name": "GSAP 安装与插件",
    "url": "https://gsap.com/docs/v3/Installation/",
    "category": "workflow",
    "subcategory": "开发文档",
    "summary": "GSAP 模块、插件注册及安装助手，复杂动效开发可直接参考。",
    "tags": [
      "GSAP",
      "Docs"
    ],
    "kind": "开发文档",
    "preview": "terminal",
    "install": "npm install gsap",
    "usage": "import gsap from \"gsap\";",
    "github": "",
    "skill": "",
    "demo": "",
    "notes": "GSAP 模块、插件注册及安装助手，复杂动效开发可直接参考。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false
  },
  {
    "id": "community-curated-zhongguose-com-1",
    "name": "中国色 · 中国传统颜色",
    "url": "https://zhongguose.com/",
    "category": "color",
    "subcategory": "配色灵感",
    "summary": "中国传统色名称和色值，适合文化与国风配色参考。",
    "tags": [
      "传统色",
      "中国色",
      "国风",
      "Palette"
    ],
    "notes": "",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "设计资源",
    "preview": "color",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-colorhexa-com-2",
    "name": "ColorHexa",
    "url": "https://www.colorhexa.com/",
    "category": "color",
    "subcategory": "配色工具",
    "summary": "颜色查询、色值转换、配色关系和对比分析。",
    "tags": [
      "HEX",
      "RGB",
      "HSL",
      "色值",
      "色彩分析"
    ],
    "notes": "",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "设计资源",
    "preview": "color",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-color-uisdc-com-3",
    "name": "优设中国色彩",
    "url": "https://color.uisdc.com/",
    "category": "color",
    "subcategory": "配色工具",
    "summary": "面向中文设计场景的配色与色值参考入口。",
    "tags": [
      "中文配色",
      "中国色彩",
      "颜色"
    ],
    "notes": "",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "设计资源",
    "preview": "color",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-webdesignrankings-com-4",
    "name": "LOL Colors",
    "url": "https://www.webdesignrankings.com/resources/lolcolors/",
    "category": "color",
    "subcategory": "配色灵感",
    "summary": "精选的多色调色板合集，适合快速寻找配色方向。",
    "tags": [
      "Palette",
      "灵感",
      "色板"
    ],
    "notes": "",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "设计资源",
    "preview": "color",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-colordrop-io-5",
    "name": "ColorDrop",
    "url": "https://www.colordrop.io/",
    "category": "color",
    "subcategory": "配色工具",
    "summary": "交互式配色生成和成套颜色探索工具。",
    "tags": [
      "Palette",
      "Generator",
      "颜色"
    ],
    "notes": "",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "设计资源",
    "preview": "color",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-uigradients-com-6",
    "name": "uiGradients",
    "url": "https://uigradients.com/#PiggyPink",
    "category": "color",
    "subcategory": "渐变纹理",
    "summary": "提供经典 CSS 渐变色参考和颜色搭配。",
    "tags": [
      "Gradient",
      "CSS",
      "渐变"
    ],
    "notes": "",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "设计资源",
    "preview": "color",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-webgradients-com-7",
    "name": "WebGradients",
    "url": "https://webgradients.com/",
    "category": "color",
    "subcategory": "渐变纹理",
    "summary": "可直接参考和复制的渐变色背景资源。",
    "tags": [
      "Gradient",
      "CSS",
      "Background"
    ],
    "notes": "",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "设计资源",
    "preview": "color",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-color-hailpixel-com-8",
    "name": "Colordot",
    "url": "https://color.hailpixel.com/",
    "category": "color",
    "subcategory": "配色工具",
    "summary": "通过鼠标交互调整色相和明度，直观挑选颜色。",
    "tags": [
      "Color Picker",
      "拾色",
      "交互"
    ],
    "notes": "",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "设计资源",
    "preview": "color",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-grabient-com-9",
    "name": "Grabient",
    "url": "https://www.grabient.com/",
    "category": "color",
    "subcategory": "渐变纹理",
    "summary": "在线编辑渐变颜色、角度，并导出 CSS 渐变。",
    "tags": [
      "Gradient",
      "CSS",
      "Generator"
    ],
    "notes": "",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "设计资源",
    "preview": "color",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-sccnn-com-10",
    "name": "素材中国 · 字库",
    "url": "https://www.sccnn.com/ziku/",
    "category": "typography",
    "subcategory": "字体资源",
    "summary": "中文设计素材网站的字库导航与字体素材参考。",
    "tags": [
      "字库",
      "中文字体",
      "素材"
    ],
    "notes": "请以原站说明为准，下载素材及字体时核查授权条款。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "设计资源",
    "preview": "type",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-100font-com-11",
    "name": "100font",
    "url": "https://www.100font.com/",
    "category": "typography",
    "subcategory": "字体资源",
    "summary": "聚合免费商用字体，提供字体检索与授权信息入口。",
    "tags": [
      "免费字体",
      "商用",
      "中文"
    ],
    "notes": "请以原站说明为准，下载素材及字体时核查授权条款。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "设计资源",
    "preview": "type",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-dafont-com-12",
    "name": "DaFont",
    "url": "https://www.dafont.com/",
    "category": "typography",
    "subcategory": "字体资源",
    "summary": "大量英文字体分类、预览与下载目录，商用前应核查具体字体许可。",
    "tags": [
      "英文字体",
      "Font",
      "Download"
    ],
    "notes": "请以原站说明为准，下载素材及字体时核查授权条款。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "设计资源",
    "preview": "type",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-ziyouziti-com-13",
    "name": "自由字体",
    "url": "https://ziyouziti.com/",
    "category": "typography",
    "subcategory": "字体资源",
    "summary": "中文免费字体检索与字体授权相关资料。",
    "tags": [
      "中文字体",
      "免费商用",
      "Font"
    ],
    "notes": "请以原站说明为准，下载素材及字体时核查授权条款。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "设计资源",
    "preview": "type",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-maoken-com-14",
    "name": "猫啃网 · 中国大陆字体",
    "url": "https://www.maoken.com/freefonts/chinafonts",
    "category": "typography",
    "subcategory": "字体资源",
    "summary": "按地区整理的字体资源，适合搜索中文免费字体。",
    "tags": [
      "中文字体",
      "字体许可",
      "Font"
    ],
    "notes": "请以原站说明为准，下载素材及字体时核查授权条款。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "设计资源",
    "preview": "type",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-iconfont-cn-15",
    "name": "阿里巴巴 Iconfont",
    "url": "https://www.iconfont.cn/",
    "category": "icons",
    "subcategory": "图标合集",
    "summary": "海量矢量图标、项目图标库与 SVG 下载。",
    "tags": [
      "SVG",
      "Icon",
      "图标",
      "阿里"
    ],
    "notes": "请以原站说明为准，下载素材及字体时核查授权条款。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "设计资源",
    "preview": "icons",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-ikonate-com-16",
    "name": "Ikonate",
    "url": "https://ikonate.com/",
    "category": "icons",
    "subcategory": "线性图标",
    "summary": "可调描边、大小的轻量 SVG 图标集合。",
    "tags": [
      "SVG",
      "Outline",
      "图标"
    ],
    "notes": "请以原站说明为准，下载素材及字体时核查授权条款。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "设计资源",
    "preview": "icons",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-iconstore-co-17",
    "name": "Iconstore",
    "url": "https://iconstore.co/",
    "category": "icons",
    "subcategory": "图标合集",
    "summary": "设计师分享的多种风格图标包，留意各图标包授权。",
    "tags": [
      "SVG",
      "Icon Packs",
      "素材"
    ],
    "notes": "请以原站说明为准，下载素材及字体时核查授权条款。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "设计资源",
    "preview": "icons",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-iconfinder-com-18",
    "name": "Iconfinder",
    "url": "https://www.iconfinder.com/",
    "category": "icons",
    "subcategory": "图标合集",
    "summary": "图标素材搜索入口，当前可能重定向到其他平台。",
    "tags": [
      "SVG",
      "Icon",
      "素材"
    ],
    "notes": "该原站目前可能跳转至 Magnific；以跳转后的实际服务为准。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "设计资源",
    "preview": "icons",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-icooon-mono-com-19",
    "name": "ICOOON MONO",
    "url": "https://icooon-mono.com/",
    "category": "icons",
    "subcategory": "图标合集",
    "summary": "日式单色图标素材库，适合简洁界面和图示。",
    "tags": [
      "Monochrome",
      "SVG",
      "日本图标"
    ],
    "notes": "请以原站说明为准，下载素材及字体时核查授权条款。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "设计资源",
    "preview": "icons",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-svgl-app-20",
    "name": "SVGL",
    "url": "https://svgl.app/",
    "category": "icons",
    "subcategory": "品牌图标",
    "summary": "品牌与科技产品 SVG Logo 的集中检索站。",
    "tags": [
      "SVG",
      "Logo",
      "品牌"
    ],
    "notes": "请以原站说明为准，下载素材及字体时核查授权条款。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "设计资源",
    "preview": "brand",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-icons-poqobwb-dev-21",
    "name": "poqobwb Icons",
    "url": "https://icons.poqobwb.dev/",
    "category": "icons",
    "subcategory": "图标合集",
    "summary": "独立设计图标资源入口，访问性需进一步复核。",
    "tags": [
      "SVG",
      "Icons",
      "图标"
    ],
    "notes": "请以原站说明为准，下载素材及字体时核查授权条款。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "设计资源",
    "preview": "icons",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-51pptmoban-com-22",
    "name": "51PPT 模板网",
    "url": "https://www.51pptmoban.com/",
    "category": "ppt",
    "subcategory": "PPT 模板",
    "summary": "幻灯片模板与演示文稿素材的分类下载网站。",
    "tags": [
      "PowerPoint",
      "PPT",
      "模板"
    ],
    "notes": "请以原站说明为准，下载素材及字体时核查授权条款。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "资源导航",
    "preview": "presentation",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-ypppt-com-23",
    "name": "优品 PPT",
    "url": "https://www.ypppt.com/",
    "category": "ppt",
    "subcategory": "PPT 模板",
    "summary": "免费 PPT 模板、背景和演示文稿素材站。",
    "tags": [
      "PPT",
      "模板",
      "幻灯片"
    ],
    "notes": "请以原站说明为准，下载素材及字体时核查授权条款。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "资源导航",
    "preview": "presentation",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-1ppt-com-24",
    "name": "第一 PPT",
    "url": "https://www.1ppt.com/",
    "category": "ppt",
    "subcategory": "PPT 模板",
    "summary": "按场景分类的 PPT 模板、素材与图表资源。",
    "tags": [
      "PPT",
      "模板",
      "图表"
    ],
    "notes": "请以原站说明为准，下载素材及字体时核查授权条款。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "资源导航",
    "preview": "presentation",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-dingdangsheji-com-25",
    "name": "叮当设计",
    "url": "https://www.dingdangsheji.com/",
    "category": "ppt",
    "subcategory": "PPT 素材",
    "summary": "设计资源与演示模板的综合入口。",
    "tags": [
      "PPT",
      "设计素材",
      "模板"
    ],
    "notes": "请以原站说明为准，下载素材及字体时核查授权条款。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "资源导航",
    "preview": "presentation",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-ppt-sotary-com-26",
    "name": "PPT 超级市场",
    "url": "https://ppt.sotary.com/web/wxapp/index.html",
    "category": "ppt",
    "subcategory": "PPT 模板",
    "summary": "PPT 模板与演示制作资源入口，链接状态待复核。",
    "tags": [
      "PPT",
      "模板",
      "工具"
    ],
    "notes": "请以原站说明为准，下载素材及字体时核查授权条款。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "资源导航",
    "preview": "presentation",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  },
  {
    "id": "community-curated-hippter-com-27",
    "name": "HiPPTER",
    "url": "https://www.hippter.com/",
    "category": "ppt",
    "subcategory": "PPT 导航",
    "summary": "专门汇集 PPT、图表、插画与设计素材的导航网站。",
    "tags": [
      "PPT",
      "导航",
      "图表"
    ],
    "notes": "请以原站说明为准，下载素材及字体时核查授权条款。",
    "prompt": "",
    "createdAt": "2026-10-10",
    "featured": false,
    "kind": "资源导航",
    "preview": "presentation",
    "install": "",
    "usage": "",
    "github": "",
    "skill": "",
    "demo": ""
  }
]
