Center

Center is a layout component that centers its children.

default

center

import Center from '@/components/ui/Center';

export default function Demo() {
  return (
    <Center display="flex" center className="h-20 w-80 rounded bg-neutral-200 dark:bg-neutral-700">
      center
    </Center>
  )
}

centerX

center x

import Center from '@/components/ui/Center';

export default function Demo() {
  return (
    <Center display="flex" centerX className="h-20 w-80 rounded bg-neutral-200 dark:bg-neutral-700">
      center
    </Center>
  )
}

centerY

center y

import Center from '@/components/ui/Center';

export default function Demo() {
  return (
    <Center display="flex" centerY className="h-20 w-80 rounded bg-neutral-200 dark:bg-neutral-700">
      center
    </Center>
  )
}