Hyperlink

Design a single hyperlink as it would appear inside a real interface, such as body copy in an article, a product detail page, or a settings screen. The goal is to make the link feel native to the layout, not like a decorative callout.

Show the full interaction set: default, hover, visited, active, and keyboard focus. Each state should be easy to tell apart at a glance, but still feel like the same link. Use underline, color, and emphasis intentionally; do not depend on color alone.

Keep the link embedded in readable copy with the surrounding typography, spacing, and line length visible. The link should stand out enough to invite action, but not break the rhythm of the text or compete with nearby content.

Treat this as a small component with real constraints: it needs to work in context, remain accessible, and preserve clarity across states. The best version looks obvious, familiar, and easy to use without extra explanation.

Hyperlinks are the lifeblood of navigation on the web. Get creative and experiment with subtle animations or unique visual cues like icons or changing text styles to elevate the user experience.