Status

import { Status } from "@styple/design-system";

<Flex
  css={{
    gap: "$md",
  }}
>
  <Container>
    <Status />
    <Status size="lg" />
  </Container>
  <Container>
    <Status variant="primary" />
    <Status size="lg" variant="primary" />
  </Container>
  <Container>
    <Status variant="accent" />
    <Status size="lg" variant="accent" />
  </Container>
  <Container>
    <Status variant="danger" />
    <Status size="lg" variant="danger" />
  </Container>
  <Container>
    <Status variant="success" />
    <Status size="lg" variant="success" />
  </Container>
</Flex>