# 테마 적용

## 테마 색상 &#x20;

![](https://2113601596-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQwN4pCJIiPfU3rtbboz1%2Fuploads%2FzERrMgJVMPkTpdbmqaHd%2Fimage.png?alt=media\&token=299b8e32-3bce-4202-978e-0d973333b555)![](https://2113601596-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQwN4pCJIiPfU3rtbboz1%2Fuploads%2FO5KSy3lGMaY7lQAksWx3%2Fimage.png?alt=media\&token=6cf7aaa8-2c0d-4467-9467-6ff4043c1f69)

UI/UX 컴포넌트에 사용되는 테마의 색상을 살펴보기 위해, 아래 예제 코드를 사용하면 테마 색상이 어떻게 적용되는지 색상 코드표를 확인할 수 있습니다.

```dart
ShowThemeColors();
```

이 코드를 실행하면 앱의 다양한 컴포넌트에서 사용되는 주요 색상을 시각적으로 확인할 수 있습니다. 이러한 색상을 테마에서 일관되게 정의하면 앱 전체적으로 일관된 색상 팔레트를 사용할 수 있습니다.

## 테마 쇼케이스&#x20;

![](https://2113601596-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQwN4pCJIiPfU3rtbboz1%2Fuploads%2F9dgSVBet1BQxHLscpQGs%2Fimage.png?alt=media\&token=0a4fd797-ffee-4d30-af73-d181cd297579)![](https://2113601596-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQwN4pCJIiPfU3rtbboz1%2Fuploads%2FfODid8yks4kj0w10QNrL%2Fimage.png?alt=media\&token=939f4aa1-2385-4998-b091-5cd03401014f)

테마의 색상을 이해했다면, 다음으로 UI/UX 컴포넌트에 테마가 어떻게 적용되는지 실제 예시를 통해 확인해보세요. 아래 예제 코드를 사용하면 다양한 위젯들에 테마가 어떻게 적용되는지 살펴볼 수 있습니다.

```dart
ThemeShowcase();
```

이 코드를 실행하면 버튼, 텍스트, 아이콘 등과 같은 다양한 위젯에서 테마의 스타일이 어떻게 적용되는지 확인할 수 있습니다. 이를 통해 테마가 앱의 모든 구성 요소에 어떻게 일관성 있는 디자인을 제공하는지 이해할 수 있습니다.&#x20;

테마를 더 자세히 사용하거나 커스터마이징이 필요한 경우, 플러터 공식 문서 및 추가 자료를 참고하여 다양한 위젯을 개발할 수 있습니다. 이로써 앱의 디자인을 더욱 개선할 수 있습니다.&#x20;

플러터 앱에서 테마를 적용하는 것은 사용자 경험을 향상시키고 일관된 디자인을 유지하는 데 중요한 역할을 합니다. 테마 색상과 테마 쇼케이스를 통해 테마의 기본 원리를 익히고, 테마 적용 가이드를 참고하여 더 복잡한 앱 디자인을 구현할 수 있으며, 이를 통해 사용자들에게 훌륭한 앱 경험을 제공할 수 있습니다.&#x20;