
Sign-in error: wrong password screen for a mobile app, designed for Fernway, a fictional productivity product. Shows the sign-in screen after a wrong password: an alert with the attempts left before a temporary lock, the password field marked with an icon and message, and the Forgot? link kept close. Minimal style: cool neutrals, Inter, 8px corners and soft shadows. Comes with the full HTML and a DESIGN.md with light and dark colour tokens.
Part of Log in with two-factor (step 2)
#f7f7f9 · surface #e8e8ef · text #1b1b23 · muted #62626e · primary #3b80d4 · accent #6c64cb#0c0c10 · surface #1b1b22 · text #eeeef0 · muted #b0b0b9 · primary #90c0ff · accent #b7b7ffAdd 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-login-errorSettings → 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-login-error
gemini mcp add --transport http made-good-designs https://madegooddesigns.com/inspiration/mcp?ref=ui-login-error
Add this to the app's MCP config (Windsurf: mcp_config.json).
Fonts: 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.