Files

JiWoong Sul 83c5e3d64e Refactor screens to MVC architecture with modular widgets

- Extract business logic from screens into dedicated controllers
- Split large screen files into smaller, reusable widget components
- Add controllers for AddSubscriptionScreen and DetailScreen
- Create modular widgets for subscription and detail features
- Improve code organization and maintainability
- Remove duplicated code and improve reusability

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

2025-07-11 00:21:18 +09:00

4.1 KiB

Raw Blame History

구독관리 앱 글래스모피어즘 컬러 & 텍스트 컬러 가이드

구독관리 앱에 글래스모피어즘을 적용할 때, 신뢰성, 편안함, 트렌드함을 모두 잡으면서도 텍스트 가독성을 최우선으로 고려한 컬러 팔레트와 활용법을 안내합니다.

1. 컬러 팔레트 제안

용도	컬러명	Hex 코드	설명/느낌
메인	Deep Blue	#2563eb	신뢰, 포인트
서브	Sky Blue	#60a5fa	트렌디, 그라디언트
포인트	Soft Mint	#38bdf8	상쾌함, 포인트
배경	Light Gray	#f1f5f9	편안함, 밝은 배경
글래스 효과	White Glass	#ffffff(투명)	반투명 글래스 효과
포인트	Pink Accent	#f472b6	트렌디, 액센트
그림자	Shadow Black	rgba(0,0,0,0.08)	깊이감 부여

2. 텍스트 색상 가이드

밝은 배경(예: #f1f5f9, #ffffff(투명)) 위에는 어두운 텍스트를,
진한 컬러(예: #2563eb, #38bdf8) 위에는 밝은 텍스트를 사용해야 가독성이 좋습니다.

배경 컬러	추천 텍스트 컬러	용도/설명
Light Gray (#f1f5f9)	Dark Navy (#1e293b)	메인 텍스트, 타이틀, 버튼
White Glass (투명)	Deep Blue (#2563eb)	강조 텍스트, 버튼
Deep Blue (#2563eb)	Pure White (#ffffff)	버튼, 반전 텍스트
Sky Blue (#60a5fa)	Navy Gray (#334155)	서브 텍스트, 부가 설명
Soft Mint (#38bdf8)	Navy Gray (#334155)	포인트 텍스트
Pink Accent (#f472b6)	Deep Blue (#2563eb)	강조, 포인트 텍스트

3. 실전 적용 예시

배경: Light Gray (#f1f5f9)
글래스 카드: White Glass (rgba(255,255,255,0.2)), 테두리 Deep Blue (#2563eb)
메인 텍스트: Dark Navy (#1e293b)
서브/설명 텍스트: Navy Gray (#334155)
버튼 배경: Deep Blue (#2563eb)
버튼 텍스트: Pure White (#ffffff)
포인트/액센트: Soft Mint (#38bdf8), Pink Accent (#f472b6)

4. 그라디언트 및 글래스 효과 예시

// Flutter 예시 (Dart)
LinearGradient(
  begin: Alignment.topLeft,
  end: Alignment.bottomRight,
  colors: [
    Color(0xFF2563eb),
    Color(0xFF60a5fa),
    Color(0xFFe0e7ef),
  ],
)

글래스 카드 배경: rgba(255,255,255,0.2) + blur + border(Deep Blue)
텍스트: #1e293b(진한 네이비) 또는 #2563eb(딥블루) 사용

5. 디자인 팁

텍스트 대비를 항상 체크하세요.
밝은 배경에는 어두운 텍스트, 진한 배경에는 밝은 텍스트!
포인트 컬러는 버튼, 아이콘, 강조 텍스트에만 제한적으로 사용하면 세련됨이 살아납니다.
글래스 효과는 투명도와 블러, 그리고 경계선 컬러(예: #2563eb, #60a5fa)로 깊이감을 더하세요.

6. 컬러/텍스트 조합 요약표

배경색	텍스트색	용도 예시
#f1f5f9	#1e293b	메인 타이틀, 내용
#ffffff(투명)	#2563eb	카드 내 강조
#2563eb	#ffffff	버튼, 반전 강조
#60a5fa	#334155	서브, 설명
#38bdf8	#334155	포인트, 서브텍스트

결론

블루+화이트+민트 조합과, 밝은 배경+어두운 텍스트 원칙으로 신뢰성, 편안함, 트렌드함, 가독성 모두 챙길 수 있습니다.
실제 앱에 적용할 때는 위 표를 참고해 각 상황별로 텍스트 컬러를 꼭 맞춰주세요.
글래스모피어즘 효과와 대비 높은 텍스트 조합으로, 세련되고 사용성 좋은 구독관리 앱을 완성할 수 있습니다.

4.1 KiB Raw Blame History