Legal link

v1.0

Legal links navigate users to legal documents and policy pages.

Considerations

Hierarchy

In the user journey, we use visual elements like space, size, depth, and color to efficiently guide users to the most relevant next steps.   Color is especially useful for way-finding. We use blue to draw users attention to primary actions.

Contemporary

eBay is particularly vulnerable to the perception of being outdated and irrelevant, largely influenced by how we present ourselves in our product. By adopting the latest UI and UX industry standards, we challenge this perception and ultimately build trust with our users.

Evo is a personification of modernity, is industry standard and has been thoroughly user tested.

Placement

Legal links should be placed where users expect them (e.g., website footer, account creation, near relevant interactive elements). The surrounding context should clearly indicate the link's purpose.

Usage guidelines

When to use

Linking to legally required documents, like terms of service, privacy policies, or return policies
When users need to review legal terms before completing an action

When not to use

General navigation that doesn't involve a legal document
Informational links that don't carry compliance requirements; use a text link instead

Placement

Footer: standard location for site-wide policies like Terms of Service, Privacy Policy, and Return Policy
Checkout and cart: near consent actions, with links to Terms & Conditions, Refund Policies, and shipping policies before users finalize a purchase
Account registration and login: where users provide personal data — link to Privacy Policy and Terms of Service
Product pages: for specific disclaimers like warranties, safety information, or age restrictions
Subscriptions and membership sign-ups: include Terms of Use and Cancellation Policies before users commit
Email and data collection pop-ups: link to Privacy Policy when collecting emails or personal information
Policy pages: when linking out to any internal policy page

Anatomy

Text
Underline

Elements

Text

Legal link text names the legal document or policy users will find when they select it. Use standard legal terminology, not shortened or paraphrased versions.

Match casing to the document or page title
No ending punctuation
Fewer than 6 words

Three legal links stacked. “User agreement”, “Privacy”, and “Consumer Health Data”.

Appearance

To ensure modernity, heuristic accuracy, and legal compliance, the legal shade of blue is distinct from primary action blue. This allows legal links to maintain the right visual hierarchy, feel contemporary, and meet compliance standards.

This specific style provides adequate affordance without hindering the user's primary tasks. For additional clarity the underline appearance should use skip ink style.

When a legal link is used in a group of other links, apply the legal style to all.

Color

Legal links must use the specific legal link color on standard light and dark theme backgrounds (Foreground/Link/Legal). See Color tokens for details.

Icon

Icons grouped with legal links should match the link color. Examples are program badges paired with legal links.

Background

Color exception: Links placed on backgrounds using our expanded color palette should use the coordinating foreground color to match. This ensures we meet WCAG’s 4.5:1 ratio standard for AA contrast. See Accessibility foundations for more info.

A marketing banner with a legal link under the call to action. The legal link matches the blue color theme.

Size

Legal links inherit their size and styling from the content around them.

State

Legal links use state layers for interaction states. The available states are enabled, hover, focused, visited, and disabled. Learn more about the state layer color values in Color tokens.