Icon Button

Icon Button (아이콘 버튼)

버튼 안에 아이콘을 렌더링하는 컴포넌트예요. 아이콘 전용 버튼을 손쉽게 만들 수 있어요.

출처: 문서

본문

사용법 (Usage)

import { IconButton } from "@chakra-ui/react"
<IconButton aria-label="Search database">
  <LuSearch />
</IconButton>

예제 (Examples)

크기 (Sizes)

size prop을 사용해 버튼의 크기를 변경해요.

변형 (Variants)

variant prop을 사용해 시각적 스타일을 변경해요.

색상 (Color)

colorPalette prop을 사용해 버튼의 색상을 변경해요.

둥글게 (Rounded)

rounded="full"로 설정하면 버튼을 완전히 둥글게 만들어요.

Props

Button 컴포넌트의 Button 부분에 대한 prop 테이블 (loading, loadingText 제외, 대화형 문서 참고).

더 알아보기 (Learn more)