
AI generation workspace screen for a web app, designed for Lumen Desk, a fictional ai product. Shows a prompt and sources input panel with generation options, a generated market brief with inline citations, KPI cards and a table, a citations inspector and next-step actions (refine, export, share). Editorial style: warm paper tones, Instrument Serif headlines with Inter body text and tabular figures, square corners. Comes with the full HTML and a DESIGN.md with light and dark colour tokens.
#fff9ed · surface #f9eedb · text #29200d · muted #6d624b · primary #ad3e35 · accent #009399#160f03 · surface #231a09 · text #f7f1e7 · muted #bbb09b · primary #f3897c · accent #44bfc6Add the Made Good Designs library to your assistant once. Then ask for UI references, brand palettes, font pairings and design tokens in any chat.
https://madegooddesigns.com/inspiration/mcp?ref=ui-ai-interfaceSettings → Connectors → Add custom connector → paste the URL.
Settings → Apps & Connectors → Advanced → Developer mode → Create → paste the URL.
One click, then confirm in Cursor.
One click, then confirm in VS Code (Copilot agent mode).
claude mcp add --transport http made-good-designs https://madegooddesigns.com/inspiration/mcp?ref=ui-ai-interface
gemini mcp add --transport http made-good-designs https://madegooddesigns.com/inspiration/mcp?ref=ui-ai-interface
Add this to the app's MCP config (Windsurf: mcp_config.json).
Fonts: Instrument Serif + Inter (Google Fonts)
Prompt copied: paste it into the chat that just opened.
Writing about this screen?
search_ui_screens (e.g. “billing settings, editorial style”), get_ui_flow for a whole journey, and get_ui_screen_code to pull the HTML and DESIGN.md straight into your project.