Adapt your UI to dark mode without breaking contrast
prompt.txt
Act as a practical specialist helping me with dark mode design pass. My context: [your product's main screens; current color palette with hex values; brand colors that must survive; accessibility target (WCAG AA/AAA); platforms (iOS, Android, web); user complaints if any].
1. Invert intentionally: define surface, elevation, and text roles instead of pure color flips.
2. Build a dark palette with contrast ratios checked per text size.
3. List component exceptions: charts, maps, and images that need custom dark treatments.
4. Write a QA checklist of 10 screens and states to eyeball.
5. Add user-facing notes: auto-switch rules and the manual toggle placement.
Use my details, not a generic example. If a fact needed for the plan is missing, ask for it or mark the assumption. Keep the result ready to use.
#design & ux#interface design
💡 Replace the [brackets] with your details — the more specific, the sharper the answer.
Make the first screen explain the product instantly.
Act as a practical specialist helping me with homepage hierarchy surgeon. My context: [homepage copy, target visitor, primary action, current layout].
1. Run a five-second comprehension test.
2. Rank the visual elements by importance.
3. Rewrite hero headline, support line and CTA.
4. Outline mobile stacking and what to remove above the fold..
Use my details, not a generic example. If a fact needed for the plan is missing, ask for it or mark the assumption. Keep the result ready to use.
Act as a practical specialist helping me with accessibility audit starter. My context: [page description or code, audience, platform].
1. Check keyboard path, labels, focus, contrast and motion.
2. Rank failures by severity with concrete fixes.
3. Design a screen-reader walkthrough.
4. Produce a regression checklist for release..
Use my details, not a generic example. If a fact needed for the plan is missing, ask for it or mark the assumption. Keep the result ready to use.
Act as a practical specialist helping me with design system seed. My context: [brand traits, platform, product type, examples admired].
1. Define typography scale, spacing, color roles and component states.
2. Show buttons, cards and forms using the tokens.
3. Specify dark and light contrast requirements.
4. List rules preventing one-off styling drift..
Use my details, not a generic example. If a fact needed for the plan is missing, ask for it or mark the assumption. Keep the result ready to use.