# 테마 사용
dotLottie 테마를 적용하고 라이트 및 다크 변형을 Framer 색상 모드에 연결하세요.

테마를 사용하면 애니메이션 파일을 따로 내보내지 않고 하나의 dotLottie 파일에서 이름이 있는 시각적 변형을 제공할 수 있습니다. 선택한 파일에 호환되는 테마 데이터가 있을 때만 테마 컨트롤이 표시됩니다.

## 테마 미리 보기

1. 테마가 들어 있는 애니메이션을 엽니다.
2. 테마 컨트롤에서 **Default** 대신 이름이 있는 테마를 선택합니다.
3. 애니메이션을 재생하고 첫 프레임이 아니라 전체 결과를 확인합니다.

## Framer 라이트 및 다크 모드 설정

**Configure themes**에서 파일 테마 하나를 Framer 라이트 모드에, 다른 하나를 다크 모드에 연결합니다. 삽입한 컴포넌트는 이 테마 ID를 저장하고 사이트 색상 모드에 맞춰 반응합니다.

<Image src="https://assets.docs.lottiefiles.com/static/3934641373-640.webp" alt="Framer에서 애니메이션 테마 구성" caption="Framer에서 애니메이션 테마 구성" zoom variant="default" srcSet="https://assets.docs.lottiefiles.com/static/3934641373-640.webp 640w, https://assets.docs.lottiefiles.com/static/3934641373-1024.webp 1024w, https://assets.docs.lottiefiles.com/static/3934641373-1920.webp 1920w" width="1920" height="1080" loading="lazy" data-blur="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAFCAYAAAB4ka1VAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAkklEQVR4nB3MvQqCUBxA8fuYDYFNBTkJ9mLNPUFDRVpihnq1Vbx/TcWPOpFn/cFRtyBEZznPOCHWmix/kWrN0X+wWDsfJVXFv+kLXSNIkTOMI6YsWdkuSkRmLNuBpmspxTAMI1LVWFsXZYzMh36aCMyboO4o+pGuabDsHepy9QmjiCCMOHge+/OJe6pJ0ozlxpl+TPeN2AaBDNwAAAAASUVORK5CYII=" />

## 렌더러 요구 사항

테마를 적용한 dotLottie 재생에는 ThorVG Player 또는 Automatic을 사용하세요. SVG Player는 전체 테마 동작을 유지하지 못하며 호환성 경고가 표시될 수 있습니다.

## 게시되는 모든 상태 테스트

- 플러그인에서 기본, 라이트, 다크 변형을 미리 봅니다.
- 게시하기 전에 Framer의 두 가지 색상 모드를 테스트합니다.
- 실제 사이트를 열고 운영체제 또는 사이트 색상 모드를 전환합니다.
- 모든 브레이크포인트에서 대비와 브랜드 색상을 확인합니다.

파일에 쓸 만한 테마가 없다면 Lottie Creator에서 테마를 편집하거나 만든 뒤 Workspace에 다시 저장하세요.

## 관련 문서

- [미리 보기 및 커스터마이즈](/ko/integrations/framer/04_prepare/previewing-and-customizing)
- [플레이어 설정](/ko/integrations/framer/05_insert-and-publish/configuring-the-player)