🎨 ν”Œλ ˆμ΄μ–΄ ν…Œλ§ˆ

7κ°€μ§€ ν…Œλ§ˆλ‘œ ν”Œλ ˆμ΄μ–΄ λ””μžμΈμ„ μ»€μŠ€ν„°λ§ˆμ΄μ§•ν•  수 μžˆμŠ΅λ‹ˆλ‹€. ν”Œλ ˆμ΄μ–΄ 컨트둀의 νŒ”λ ˆνŠΈ λ²„νŠΌμ„ ν΄λ¦­ν•˜κ±°λ‚˜ μ•„λž˜ λ²„νŠΌμœΌλ‘œ ν…Œλ§ˆλ₯Ό λ³€κ²½ν•˜μ„Έμš”.

νΌν”Œ (κΈ°λ³Έ)

πŸ“– μ‚¬μš©λ²•

// 초기 ν…Œλ§ˆ μ„€μ •
const player = new CatPlayer({
    container: '#player',
    url: 'video.mp4',
    theme: 'purple'  // κΈ°λ³Έκ°’
});

// ν…Œλ§ˆ λ³€κ²½
player.setTheme('dark');
player.setTheme('red');
player.setTheme('green');

// ν˜„μž¬ ν…Œλ§ˆ 확인
const currentTheme = player.getTheme();

// μ‚¬μš© κ°€λŠ₯ν•œ ν…Œλ§ˆ λͺ©λ‘
const themes = player.getAvailableThemes();
// [
//   { value: 'purple', label: 'νΌν”Œ (κΈ°λ³Έ)', color: '#667eea' },
//   { value: 'dark', label: '닀크', color: '#1a1a1a' },
//   { value: 'light', label: '라이트', color: '#4a90e2' },
//   { value: 'red', label: 'λ ˆλ“œ', color: '#e74c3c' },
//   { value: 'green', label: 'κ·Έλ¦°', color: '#2ecc71' },
//   { value: 'orange', label: 'μ˜€λ Œμ§€', color: '#f39c12' },
//   { value: 'pink', label: '핑크', color: '#ff6b9d' }
// ]

// ν…Œλ§ˆ λ³€κ²½ 이벀트
player.on('themeChange', (theme) => {
    console.log('ν…Œλ§ˆ 변경됨:', theme);
});

🎨 ν…Œλ§ˆ 가러리

πŸ’œ
νΌν”Œ (κΈ°λ³Έ)

μš°μ•„ν•˜κ³  λͺ¨λ˜ν•œ κ·ΈλΌλ””μ–ΈνŠΈ

πŸ–€
닀크

λ―Έλ‹ˆλ©€ν•˜κ³  κ³ κΈ‰μŠ€λŸ¬μš΄ λŠλ‚Œ

πŸ’™
라이트

밝고 κΉ”λ”ν•œ 블루

❀️
λ ˆλ“œ

열정적이고 κ°•λ ¬ν•œ λŠλ‚Œ

πŸ’š
κ·Έλ¦°

μžμ—°μŠ€λŸ½κ³  νŽΈμ•ˆν•œ λŠλ‚Œ

🧑
μ˜€λ Œμ§€

ν™œκΈ°μ°¨κ³  μ—λ„ˆμ§€ λ„˜μΉ˜λŠ” λŠλ‚Œ

πŸ’–
핑크

μ‚¬λž‘μŠ€λŸ½κ³  λΆ€λ“œλŸ¬μš΄ λŠλ‚Œ

✨ ν…Œλ§ˆ νŠΉμ§•

  • CSS λ³€μˆ˜ 기반 - λͺ¨λ“  색상이 CSS λ³€μˆ˜λ‘œ 관리됨
  • μ¦‰μ‹œ 적용 - ν…Œλ§ˆ λ³€κ²½ μ‹œ μ¦‰μ‹œ 반영
  • μΌκ΄€λœ λ””μžμΈ - λͺ¨λ“  UI μš”μ†Œμ— ν†΅μΌλœ 색상 적용
  • ν™•μž₯ κ°€λŠ₯ - μ»€μŠ€ν…€ ν…Œλ§ˆ μΆ”κ°€ κ°€λŠ₯

πŸ’‘ ν™œμš© 팁

  • λΈŒλžœλ“œ λ§€μΉ­: μ›Ήμ‚¬μ΄νŠΈ ν…Œλ§ˆμ— λ§žλŠ” 색상 선택
  • μ½˜ν…μΈ  νƒ€μž…: μ˜μƒ λΆ„μœ„κΈ°μ— λ§žλŠ” ν…Œλ§ˆ μ‚¬μš©
  • 닀크 λͺ¨λ“œ: μ•Όκ°„ μ‹œμ²­ μ‹œ 닀크 ν…Œλ§ˆ μΆ”μ²œ
  • μ‚¬μš©μž μ„€μ •: μ‚¬μš©μžκ°€ μ„ ν˜Έν•˜λŠ” ν…Œλ§ˆ μ €μž₯ κ°€λŠ₯