Breakpoints

내장된 브레이크포인트를 사용하여 쉽게 적응형 레이아웃을 구축할 수 있습니다.

Available sizes

각 브레이크포인트는 고정된 화면 너비에 해당합니다. 값은 min-width 기반이며, 화면 너비가 해당 브레이크포인트와 같거나 클 때 적용됩니다.

Usage

대부분의 컴포넌트 크기 및 레이아웃 props는 브레이크포인트에 따라 주어진 prop을 수정하기 위해 추가적인 Responsive 객체 형태를 수용합니다.

각 크기는 해당 키에 매핑되며, 각 값은 화면 크기가 명명된 브레이크포인트 이상일 때 적용됩니다.

<Heading
	size={{
		initial: "3",
		md: "5",
		xl: "7",
	}}
/>