Generate a new design based on this screen using your own content.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
# Design from Reference: Unkey Manage Role And Permissions
Create an original, high-fidelity visual design inspired by the reference. Prioritize composition, typography, colors, spacing, and component styling over technical implementation.
## Reference
- **Product:** Unkey
- **Category:** Add & Edit
- **Screenshot:** https://cdn.prod.website-files.com/5e9dc792e1210c5325f7ebbc/697b75f89e5055491cc847a3_EZKlRZemjhRJ1JcluYjRjeNdlkk9QMLJvj534Fq11qw.avif
Analyze the screenshot first. If inaccessible, request it rather than guessing.
## Content
{{content.instructions}}
{{content.data}}
Preserve essential messaging and factual accuracy. Adapt structure and copy length for visual balance; never invent product claims.
## Visual Design
Use this context to reproduce the reference's visual language: layout, typography, colors, spacing, borders, radii, and distinctive elements. The screenshot takes priority if descriptions conflict.
## Direction
{{preferences.fidelityInstructions}}
## Output
{{output.instructions}}
Deliver a polished, cohesive design with precise alignment, hierarchy, and spacing. Produce the requested visual artifact, not just a description. If unsupported, explain the limitation.
The first thing that grabs you is that centered modal floating over a well-structured table view. Unkey's API key management dashboard nails the information hierarchy here. The left sidebar uses subtle weight differences to separate navigation sections like APIs, Ratelimit, and Authorization without feeling cluttered.
Restrained Color, Strong Clarity
Almost everything is black, white, and gray. The only real color pop is that green "Operational" status badge, and it works perfectly because your eye goes right to it. Typography is small but readable, leaning on consistent sizing and spacing rather than bold type treatments to create structure. The modal itself is dead simple. Label, dropdown, button. No extra decoration.
What Makes It Stand Out
That key identifier chip at the top of the modal with the subtle icon is a smart touch. It confirms exactly what you're editing before you make changes. The "This key will be updated immediately" micro-copy below the CTA is honest and direct. Little details like "Usage 0%" in the sidebar footer show thoughtful use of every pixel.