Install the Fragments UI library and configure FragmentsProvider in React projects.
npx skills add https://github.com/fragments-sdk/skills --skill fragments-ui-setup
Please help me install this Agent Skill. Skill: fragments/ui-setup Source: https://github.com/fragments-sdk/skills/tree/main/skills/ui-setup Command: npx skills add https://github.com/fragments-sdk/skills --skill fragments-ui-setup
This Skill removes the friction of installing and wiring up the Fragments UI design system so components render correctly with theming, tokens, and an optional AI MCP server.
@fragments-sdk/ui and icon dependencies, and configures the required CSS import order so tokens load properly.FragmentsProvider in the right place (including Next.js client component constraints) and creates a sample component to confirm it works.Run the fragments/ui-setup skill to install @fragments-sdk/ui, add the required CSS import, wrap your app with FragmentsProvider using your chosen theme, and render the included Welcome component.
High-intent search queries and answers about installing and using this skill.
To set up a React design system provider with theming in Next.js, you wrap your app with FragmentsProvider and import the required stylesheet. This ensures components render correctly with tokens, applying to App Router, Pages Router, Vite, and Remix.
The correct CSS import order for Fragments UI tokens requires the stylesheet to load before component styles. This Skill configures the necessary imports automatically so tokens load properly and theming applies without visual conflicts.
Yes, Fragments UI works with Vite and Remix frameworks. The setup detects your React-based framework and applies the correct provider wiring, including Next.js client component constraints and TypeScript module resolution checks.
To add an MCP server to Claude settings without overwriting existing servers, the setup performs a safe optional merge into the .claude/settings.json file. This preserves your current MCP server configurations while integrating the Fragments server.
Broken Fragments UI component imports in a TypeScript monorepo often stem from subpath export resolution failures. This setup checks for TypeScript 5+ and sets moduleResolution to bundler when needed to resolve monorepo and module edge cases.
Yes, you can install a React UI component library and verify it with a sample component. This setup installs the packages, configures the provider, and renders an included Welcome component as a sanity check to confirm the integration works.
mweinbachRun JavaScript and TypeScript scripts with Bun's runtime and bundler.
UCloud-FEWrap React applications with ThemeProvider from @ucloud-fe/react-components.
DexploarerGenerate Next.js 13+ App Router pages, components, and API routes.
pengtoshiDetect package managers and wire workspace dependencies across monorepos.