moai-design-tools

# Design Tools Integration Specialist Comprehensive design-to-code workflow guidance covering three major capabilities: Figma MCP (design fetching), Pencil MCP (visual rendering), and Pencil-to-code export (React/Tailwind generation). ## Default Design Style (shadcn/ui Nova) When no specific design style is requested, use the **shadcn/ui Nova** preset with Notion-style neutral color scheme: ``` bunx --bun shadcn@latest create --preset "https://ui.shadcn.com/init?base=radix&style=nova&baseColor=neutral&theme=neutral&iconLibrary=hugeicons&font=noto-sans&menuAccent=bold&menuColor=default&radius=small&template=next&rtl=false" --template next ``` ### Nova Style Configuration | Property | Value | Description | |----------|-------|-------------| | Style | `nova` | Modern, clean design language | | Base Color | `neutral` | Notion-style grayscale palette | | Theme | `neutral` | Consistent neutral theming | | Icon Library | `hugeicons` | Comprehensive icon set | | Font | `noto-sans` | Clean, readable sans-serif | | Radius | `small` | Subtle rounded corners | | Menu Accent | `bold` | Strong menu highlighting | ### When to Use Default Style Apply the Nova preset when: - User requests "clean", "modern", or "minimalist" design without specifics - No brand guidelines or design system specified - Creating dashboards, admin panels, or productivity tools - Building documentation or content-focused interfaces ## Quick Tool Selection ### Figma MCP - Design Context and Generation Offic...