Loading...
Loading...
Found 71 Skills
Use the DuskMoon Elements custom element library (`<el-dm-*>` web components). Use when building web pages or apps with DuskMoon elements, registering elements, setting properties/attributes, listening to events, using slots, applying themes, or styling with CSS custom properties. Covers all 43 element packages (button, card, input, dialog, table, tabs, markdown-input, code-block, pro-data-grid, circle-menu, and more).
Add Shadcn UI components with dark mode support using next-themes. Includes theme provider and CSS variables configuration.
Designs optimal filtering UX for data tables. Use when building a table that needs filters - analyzes the data columns and determines the best filter type for each. Outputs a unified filter field with inline header filters.
Use umb-input-manifest to pick registered extensions in Umbraco backoffice
This skill should be used when the user asks to "add a component", "use shadcn", "install Button", "create Dialog", "add Form", "use DataTable", "implement dark mode toggle", "use cn utility", or discusses UI components, component libraries, or accessible components. Always use the latest shadcn/ui version and modern patterns.
Create pixelated borders, shadows, and effects for 8-bit retro components. Apply when building 8-bit styled UI components that need authentic pixel art aesthetics.
Creates frosted glass UI elements with blur, transparency, and subtle borders. Use when building overlays, floating controls, tooltips, or any element that should appear elevated with a translucent background.
When using npm package `@duskmoon-dev/core`, this skill shows how to install, configure, and use the CSS component library
Create new GPUI components. Use when building components, writing UI elements, or creating new component implementations.
Use when building complex organisms from molecules and atoms like headers, footers, product cards, and sidebars. Organisms are distinct UI sections.
Scaffolds a new design in the design-inspirations repo with preview component, detail page, and main page entry. Use when creating a new design, adding a design inspiration, or scaffolding design files.
Add visual animations (cursor, typing, click effects) to AgentPulse-enabled React apps. Use when: showing users what AI is doing, adding visual feedback for agent actions, configuring element targeting for animations.