Skip to content
Forge

Underlined tabs

Understated tabs with an underlined active tab, to organize the information on a product page.

  • Tailwind
  • React
  • CSS
  • WordPress
Open in a new tab

Description

The component follows the WAI-ARIA tabs pattern: left and right arrows switch tabs, Home and End jump to the first or last one, with visible focus on tab and panel. Without JavaScript, the three panels stay displayed one below the other.

Code

Loading the code…

Archive contents

onglets-soulignes-html-tailwind.zip3 files · 4 Ko

  • index.html5 Ko
  • README.md2 Ko
  • LICENSE.md1 Ko

Tags

Updated on October 13, 2026.

In the same spirit

  • Vertical tabs

    Coming soon

    A column of tabs on the left and content on the right, for settings and customer area pages.

    • Tailwind
    • React
    • CSS
    • WordPress
    Component

  • Pill tabs

    Coming soon

    A pill selector in a rounded track, to compare plans or variants.

    • Tailwind
    • React
    • CSS
    • WordPress
    Component

  • Folder tabs

    Coming soon

    Binder-style folder tabs that merge into the active panel, for a day-by-day itinerary.

    • Tailwind
    • React
    • CSS
    • WordPress
    Component

  • Tabs with icons

    Coming soon

    Large tabs illustrated with an icon, to guide each type of visitor to their offer.

    • Tailwind
    • React
    • CSS
    • WordPress
    Component
Underlined tabs | Forge