Cloudflare LogoNavigate Back
Cloudflare Style
Cloudflare Style is in Alpha and is a work-in-progress. Expect changes. Contact DESSYS with any questions.
Components
Structure

Tabs

Tabs help a user navigate between alternate views on a page within a given context.

  • Design
  • Implementation

Tabs should always look and function in the same way. Tabs are used to change view, so the principle of least surprise applies. Interactions and affordance should always be consistent and expected.

The content of a tab’s scope should be relevant and clearly connected to the visual design of the composition.

All tabs should be labeled with clear, concise content to help set user expectations of the scope contained within a tab.

Content should be grouped logically within each tab. If content cannot be clearly organized within different tabs, consider an alternative UI solution.

Tabs should not be used as navigation.

Tabs should not be used solely for the purpose of visually lightening content density.

Product Usage

  • Dashboard
  • Teams
  • Radar
    v3.1.440Last updated June 10, 2021
    Open in FigmaView source

    • LinkedIn
    • Facebook
    • Twitter
    • GitHub
    • YouTube

    Cloudflare LogoNavigate back
    • © 2021 Cloudflare, Inc.
    • About Cloudflare
    • Careers
    • Terms of Use
    • Disclosure
    • Trademark