Figma

공식 Chakra UI Figma Kit를 사용하면 더 빠르게 디자인하고 코드와 동기화를 유지할 수 있어요. Figma에서도 코드와 동일한 구성 요소로 작업해 디자이너와 개발자가 쉽게 협업할 수 있는 키트입니다.

출처: 문서

본문

이 키트는 코드에 존재하는 것과 동일한 구성 요소로 디자인할 수 있게 해 줘요. 덕분에 개발자와 디자이너가 더 쉽게 협업하고, 일관성을 유지하며, 더 빠르게 작업할 수 있습니다.

Figma Community에서 키트를 무료로 받을 수 있어요.

키트의 모든 것은 Chakra UI가 동작하는 방식을 그대로 반영하도록 설계되었으므로, 여러분의 디자인 결정이 그대로 프로덕션 컴포넌트로 이어져요.

Figma 키트에는 라이트 모드와 다크 모드 토큰 세트가 기본으로 포함되어 있어요.

다크 모드 토큰으로 전환하려면:

팁: 디자인을 다시 만들 필요 없이 언제든지 Chakra/Light와 Chakra/Dark를 서로 바꿔 사용할 수 있어요. 시맨틱 토큰 레이어가 자동으로 전환을 처리해 줍니다.