A tabs-end component closes the current tabbed content section. Components placed after it return to the normal page layout.

Always add a tabs-end component after the final tab. This makes the page structure explicit and prevents later content from unintentionally becoming part of the last tab.

Use it as a clear boundary

Place shared content—such as a final instruction, action or normal page section—after the tabs-end marker only when it applies to all tabs. If content applies to just one category, keep it within that tab.

Keep the end marker with the tab set

Treat tabs-end as part of the tab structure, not as decoration. Add it immediately after the final tab’s content. When you reorder or remove a tab, review the marker as well: leaving it too early makes later content escape the final tab, while omitting it can make shared content appear to belong to the last tab.

Put a clear heading on the first shared section after tabs end if the page changes topic. This supports people reading in order and makes the transition obvious on smaller screens where the visual tab treatment is less prominent.

Test checklist

• The marker appears immediately after the final tab content.
• No intended shared content remains inside the last tab.
• Content that is specific to a tab has not moved outside it.
• The page transition is clear in a narrow, single-column layout.
• Editing or removing a tab has not affected later page content.

flowchart LR
  A[Start a named tab] --> B[Components in the tab]
  B --> C[Start another tab or close the tabbed section]
  C --> D[Tabs end]
  D --> E[Normal page content]

Check before publishing

• Every tab has a clear title and intended content.
• The final tab is followed by a tabs-end component.
• Shared content appears after the tabs-end marker.
• The page remains understandable when read in order on a narrow display.

Related guidance

• Tab components
• Design accessible services