Container

Container is a styled wrapper component that provides consistent background, border, and border radius styling for content.

Live Editor

function ContainerExample() {
  return (
    <Container p={400}>
      This is a container with default styling.
    </Container>
  );
}

Properties

System Props: COMMON, LAYOUT, FLEXBOX, GRID

Overview

Container is a lightweight wrapper component built on top of Box that provides consistent styling for containers throughout your application. It includes default background color, border, and border radius based on the Seeds design tokens.