> ## Documentation Index
> Fetch the complete documentation index at: https://daehan-base.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# 디자인 리소스

> 뛰어난 미니 앱 구축을 위한 디자인 도구, 영감, 리소스 모음

> 뛰어난 미니 앱 구축을 위한 디자인 도구, 영감, 리소스 모음

### UI 영감 및 디자인 패턴

* **[디자인 스펙](/images/miniapps/miniapp-design-spec.png)** - Base 앱에서 미니 앱이 어떻게 표시되는지 확인
* **[Mobbin](https://mobbin.com/)** - 포괄적인 모바일 앱 디자인 패턴 및 스크린샷
* **[Dribbble](https://dribbble.com/)** - 크리에이티브 디자인 커뮤니티 및 영감
* **[Pinterest](https://pinterest.com/)** - 시각적 발견 및 영감

### 디자인 시스템 및 컴포넌트 라이브러리

* **[Base 브랜드 가이드라인](https://www.base.org/brand)** - 브랜드 기준 및 자산
* **[Material Design](https://material.io/design)** - Google의 디자인 시스템
* **[Human Interface Guidelines](https://developer.apple.com/design/human-interface-guidelines/)** - Apple의 디자인 원칙

### 프로토타이핑 및 디자인

* **[Figma](https://figma.com/)** - 협업 인터페이스 디자인 도구
* **[Adobe XD](https://www.adobe.com/products/xd.html)** - UI/UX 디자인 및 프로토타이핑

### 색상

* **[Coolors](https://coolors.co/)** - 색상 팔레트 생성기
* **[Adobe Color](https://color.adobe.com/)** - 색상 휠 및 팔레트 생성기
* **[WebAIM Contrast Checker](https://webaim.org/resources/contrastchecker/)** - 접근성 테스트

### 타이포그래피

* **[Google Fonts](https://fonts.google.com/)** - 무료 웹 폰트
* **[Font Pair](https://www.fontpair.co/)** - 폰트 조합 제안
* **[WhatTheFont](https://www.myfonts.com/WhatTheFont/)** - 폰트 식별 도구

### 아이콘 라이브러리

* **[Heroicons](https://heroicons.com/)** - 아름답게 제작된 SVG 아이콘
* **[Lucide](https://lucide.dev/)** - 아름답고 일관된 아이콘 툴킷
* **[Feather Icons](https://feathericons.com/)** - 간결하고 아름다운 오픈 소스 아이콘
* **[Iconify](https://iconify.design/)** - 통합 아이콘 프레임워크

### 일러스트레이션 및 그래픽

* **[Undraw](https://undraw.co/)** - 오픈 소스 일러스트레이션
* **[Humaaans](https://www.humaaans.com/)** - 믹스 앤 매치 일러스트레이션 라이브러리
* **[Open Peeps](https://www.openpeeps.com/)** - 손으로 그린 일러스트레이션 라이브러리
* **[Storyset](https://storyset.com/)** - 무료 애니메이션 일러스트레이션
* **[Freepik](https://www.freepik.com/)** - 그래픽 리소스 및 일러스트레이션

### 사진

* **[Unsplash](https://unsplash.com/)** - 무료 고해상도 사진
* **[Pexels](https://www.pexels.com/)** - 무료 스톡 사진 및 영상

### 개발 및 코드 리소스

* **[Shadcn](https://ui.shadcn.com/docs)** - 오픈 코드의 아름답고 접근 가능한 컴포넌트
* **[Tailwind CSS](https://tailwindcss.com/)** - 유틸리티 우선 CSS 프레임워크
* **[Framer Motion](https://www.framer.com/motion/)** - 프로덕션 준비 모션 라이브러리
* **[Lottie](https://lottiefiles.com/)** - 경량 애니메이션