Section

Full-width section wrapper with standard vertical padding. White or off-white background.

4 tokens

Preview

Full-width wrapper with the standard vertical padding and content container.

import { Section } from '@/components/marketing/section'

<Section bg="alt">
  {/* section content */}
</Section>

This component reads these tokens directly: change one on a Foundations page and it updates here and across the site.

Background--ds-bg

#FFFFFF

Surface--ds-surface

#F5F7F5

Section padding Y--ds-section-py

7rem

Content max width--ds-content-max

1920px