
Security vulnerabilities dashboard screen for a mobile app, designed for Wardline, a fictional developer product. Shows open findings by severity (critical/high/medium/low donut), opened-vs-resolved trend, compliance scores, an open-findings table with assets and advisory ids, and live alerts. Corporate style: IBM Plex Sans, a dark brand-coloured sidebar, 4px corners and subtle shadows. Comes with the full HTML and a DESIGN.md with light and dark colour tokens.
#f6fcff · surface #ffffff · text #0e1b21 · muted #55666f · primary #006f93 · accent #426db6#0b1418 · surface #172228 · text #e8eef1 · muted #a5b4bb · primary #4ab6e4 · accent #8bb7ffAdd 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-security-dashboardSettings → 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-security-dashboard
gemini mcp add --transport http made-good-designs https://madegooddesigns.com/inspiration/mcp?ref=ui-security-dashboard
Add this to the app's MCP config (Windsurf: mcp_config.json).
Fonts: IBM Plex Sans (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.