Components

Links

Links are navigational elements that connect users to other locations, either on the current page or to a different page or site. In contrast, buttons are used to signal important actions.

Types

Inline link

Inline links appear within a line of text or other inline elements. Inline links are underlined and retain a consistent appearance across all screen widths.

Here's the default inline link style.

Standalone link

Standalone links sit on their own line. At larger screen widths, standalone links are medium weight and underlined. At smaller screen widths, standalone links convert to full block links with top and bottom borders that have a finger-friendly touch area.

Link with icon

Each icon should be used exclusively and consistently for one action. An icon should appear after the text it represents. The only exception is a link that takes a user to a previous step or page, where the icon should appear before the link’s text. Icons should never be underlined.

Inline

The document icon is used to emphasize a link that contains a file or document . The external link icon is used to emphasize a link to a non-CFPB webpage .

Standalone

Go back

Continue

External link

Document or file

List link

A list link is an item in a set of two or more stacked standalone links. Items in a link list are medium weight and are underlined at larger screen widths. At smaller screen widths, they convert to full block links with a top and bottom border.

Destructive link

A destructive action is an action that will lead to data loss, for example, deleting data from a form or removing a file that was previously uploaded. Although a destructive action can be styled as a button, we recommend using the destructive link style (shown below) to ensure consistency across cf.gov products.

Printed links

When a page is printed from consumerfinance.gov, links should appear in the following style and include both the original link text as well as a shortened URL.

Here's the link style (cfpb.gov/about-us/blog) when printed.

Latest Updates

Page last edited:
Show all details
Edit page