Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 | 250x 250x 250x 660x | /**
* Color palette for Black Trigram Korean martial arts game
* Cyberpunk aesthetic with Korean traditional influences
*
* WCAG 2.1 Level AA Compliance:
* - Text colors meet 4.5:1 contrast ratio on dark backgrounds
* - UI elements meet 3:1 contrast ratio
* - Focus indicators use 2px borders with high contrast
*
* @see https://www.w3.org/WAI/WCAG21/Understanding/contrast-minimum.html
*/
// Primary color palette
export const KOREAN_COLORS = {
// Primary colors (Cyberpunk neon) - WCAG AA compliant on dark backgrounds
PRIMARY_CYAN: 0x00e6e6, // Increased brightness for better contrast (was 0x00ffff)
PRIMARY_BLUE: 0x0066ff,
PRIMARY_BLUE_DARK: 0x003399,
// Fix: Add missing PRIMARY_RED color
PRIMARY_RED: 0xff4444, // Increased brightness for contrast (was 0xff3333)
// Secondary colors - WCAG AA compliant
SECONDARY_MAGENTA: 0xff33ff, // Increased brightness
SECONDARY_PURPLE: 0xaa44ff, // Increased brightness (was 0x9900ff)
SECONDARY_YELLOW: 0xffff33, // Slightly reduced for better visibility
SECONDARY_ORANGE: 0xff7733, // Increased brightness (was 0xff6600)
SECONDARY_BROWN_DARK: 0x8b4513,
// Accent colors - WCAG AA compliant
ACCENT_GOLD: 0xffc400, // Increased brightness for contrast (was 0xffd700)
ACCENT_RED: 0xff4444, // Increased brightness (was 0xff3333)
ACCENT_GREEN: 0x44ff44, // Increased brightness (was 0x00ff33)
ACCENT_PRIMARY: 0x00d4ff,
ACCENT_YELLOW: 0xffff33, // Slightly reduced for visibility (was 0xffff00)
ACCENT_PURPLE: 0xaa44ff, // Increased brightness (was 0x9900ff)
ACCENT_CYAN: 0x00e6e6, // Increased brightness (was 0x00ffff)
ACCENT_ORANGE: 0xff8833,
ACCENT_BLUE: 0x3399ff,
// Korean traditional colors
KOREAN_RED: 0xc8102e,
KOREAN_BLUE: 0x003478,
KOREAN_WHITE: 0xffffff,
KOREAN_BLACK: 0x000000,
// Text colors - WCAG AA compliant (4.5:1 on dark backgrounds)
TEXT_PRIMARY: 0xffffff, // White text - maximum contrast (20.3:1 on 0x0a0a0a)
TEXT_SECONDARY: 0xcccccc, // Light gray - 3:1 contrast for large text (13.1:1 on 0x0a0a0a)
TEXT_TERTIARY: 0xaaaaaa, // Medium gray - increased brightness (8.5:1 on 0x0a0a0a)
TEXT_ACCENT: 0x00e6e6, // Bright cyan for emphasis (15.8:1 on 0x0a0a0a)
TEXT_WARNING: 0xffbb00, // Increased brightness (13.4:1 on 0x0a0a0a)
TEXT_ERROR: 0xff4444, // Increased brightness (8.2:1 on 0x0a0a0a)
TEXT_BRIGHT: 0xffffff,
// UI background colors - Very dark for maximum contrast with bright text
UI_BACKGROUND_DARK: 0x0a0a0a, // Very dark background for WCAG AA (was 0x1a1a2e)
UI_BACKGROUND_MEDIUM: 0x1a1a1a, // Dark gray for panels (was 0x16213e)
UI_BACKGROUND_LIGHT: 0x2a2a2a, // Medium dark for cards (was 0x0f0f23)
UI_STEEL_GRAY: 0x5a6578, // Increased brightness for borders (was 0x4a5568)
UI_STEEL_GRAY_DARK: 0x3d4758, // Increased brightness (was 0x2d3748)
UI_BORDER: 0x5a6578, // Increased brightness for 3:1 contrast (was 0x4a5568)
UI_BORDER_LIGHT: 0x6a6a8a, // Increased brightness (was 0x4a4a6a)
UI_GRAY: 0x909090, // Increased brightness for disabled states (was 0x808080)
UI_DISABLED_FILL: 0x3d4758, // Increased brightness (was 0x2d3748)
UI_DISABLED_BORDER: 0x2a2a3e, // Increased brightness (was 0x1a1a2e)
UI_DISABLED_BG: 0x444444, // Increased brightness (was 0x333333)
UI_DISABLED_TEXT: 0x777777, // Increased brightness for readability (was 0x666666)
// Combat effect colors - High contrast for visibility
CRITICAL_HIT: 0xff4444, // Bright red for critical hits (was 0xff0000)
BLOCKED_ATTACK: 0x909090, // Increased brightness for blocked attacks (was 0x808080)
PERFECT_STRIKE: 0xffc400, // Bright gold for perfect strikes (was 0xffd700)
VITAL_POINT_HIT: 0xff33ff, // Bright magenta for vital points (was 0xff00ff)
// Warning colors - WCAG AA compliant
WARNING_ORANGE: 0xff7733, // Increased brightness (was 0xff6600)
WARNING_YELLOW: 0xffff33, // Slightly reduced for visibility (was 0xffff00)
// Additional UI colors - Focus and active states
ACTIVE_BORDER: 0x00e6e6, // Bright cyan for active states (was 0x00ffff)
// Stance-specific colors (Trigram colors)
TRIGRAM_GEON_PRIMARY: 0xffd700, // Heaven - White
TRIGRAM_TAE_PRIMARY: 0x87ceeb, // Lake - Sky Blue
TRIGRAM_LI_PRIMARY: 0xff4500, // Fire - Orange Red
TRIGRAM_JIN_PRIMARY: 0x9370db, // Thunder - Yellow
TRIGRAM_SON_PRIMARY: 0x32cd32, // Wind - Light Green
TRIGRAM_GAM_PRIMARY: 0x1e90ff, // Water - Blue
TRIGRAM_GAN_PRIMARY: 0x8b4513, // Mountain - Brown
TRIGRAM_GON_PRIMARY: 0x2f4f4f, // Earth - Dark Khaki
// Status colors
POSITIVE_GREEN: 0x00ff00,
POSITIVE_GREEN_DARK: 0x006600,
NEGATIVE_RED: 0xff0000,
NEGATIVE_RED_DARK: 0x990000,
NEGATIVE_RED_LIGHT: 0xff4444, // Fix: Add missing NEGATIVE_RED_LIGHT
NEUTRAL_GRAY: 0x808080,
// Solid colors
WHITE_SOLID: 0xffffff,
BLACK_SOLID: 0x000000,
BLACK: 0x000000, // Fix: Add missing BLACK
TRANSPARENT: 0x000000, // With alpha 0
// Health bar colors
HEALTH_FULL: 0x00ff00,
HEALTH_MEDIUM: 0xffff00,
HEALTH_LOW: 0xff6600,
HEALTH_CRITICAL: 0xff0000,
// Ki/Energy colors
KI_FULL: 0x00ffff,
KI_MEDIUM: 0x0099cc,
KI_LOW: 0x006699,
KI_EMPTY: 0x003366,
// Stamina colors
STAMINA_FULL: 0xffff00,
STAMINA_MEDIUM: 0xffcc00,
STAMINA_LOW: 0xff9900,
STAMINA_EMPTY: 0xff6600,
// Consciousness colors
CONSCIOUSNESS_PURPLE: 0x9370db,
// Pain indicator colors
PAIN_INDICATOR: 0xff6b6b,
// Blood loss colors
BLOODLOSS_INDICATOR: 0xcc0000,
// Muscle system colors (근육 시스템 색상)
MUSCLE_TONE: 0xd4a373, // Base muscle tone - tan/brown
MUSCLE_FLEXED: 0xe8b896, // Flexed muscle - lighter tan
MUSCLE_EXHAUSTED: 0xa67856, // Exhausted muscle - darker brown
SKIN_TONE: 0xf5d7b1, // Skin/fat layer - light peachy tone
// Fix: Add missing color constants for game components
ARENA_BACKGROUND: 0x1a1a2e,
PLAYER_1_COLOR: 0x00ccff, // Cyan for player 1
PLAYER_2_COLOR: 0xff6b35, // Orange for player 2
SECONDARY_BLUE: 0x3366cc,
SECONDARY_BLUE_LIGHT: 0x5588ee,
SECONDARY_BLUE_DARK: 0x1144aa,
// Cyberpunk neon colors (add for NEON_CYAN and others)
NEON_CYAN: 0x00ffff, // Neon cyan for cyberpunk UI
NEON_PURPLE: 0xff00ff,
NEON_GREEN: 0x00ff00,
NEON_PINK: 0xff1493,
} as const;
// Cyberpunk color palette
export const CYBERPUNK_COLORS = {
// Primary neon colors - 사이버펑크 네온 색상
NEON_CYAN: 0x00ffff, // 네온 시안 - Primary UI
NEON_PURPLE: 0xff00ff, // 네온 보라 - Secondary accents
NEON_GREEN: 0x00ff00, // 네온 초록 - Success states
NEON_PINK: 0xff1493, // 네온 핑크 - Special effects
// Accent colors - 강조 색상
ACCENT_BLUE: 0x0080ff, // 강조 파랑 - Interactive elements
ACCENT_ORANGE: 0xff8000, // 강조 주황 - Warning/action
ACCENT_YELLOW: 0xffff00, // 강조 노랑 - Highlights
// Status colors - 상태 색상
WARNING_RED: 0xff4444, // 경고 빨강 - Danger/error
SUCCESS_GREEN: 0x44ff44, // 성공 초록 - Positive feedback
INFO_BLUE: 0x4444ff, // 정보 파랑 - Information
// Text colors - 텍스트 색상
TEXT_PRIMARY: 0xffffff, // 주요 텍스트 - High contrast
TEXT_SECONDARY: 0xcccccc, // 보조 텍스트 - Medium contrast
TEXT_MUTED: 0x888888, // 음소거 텍스트 - Low contrast
// Background colors - 배경 색상
BG_DARK: 0x0a0a0a, // 어두운 배경 - Main background
BG_DARKER: 0x050505, // 더 어두운 배경 - Deep background
BG_PANEL: 0x1a1a1a, // 패널 배경 - UI panels
// Neutral colors - 중성 색상
NEUTRAL_GRAY: 0x666666, // 중성 회색 - Disabled states
NEUTRAL_LIGHT: 0x999999, // 밝은 회색 - Borders
NEUTRAL_DARK: 0x333333, // 어두운 회색 - Separators
// Special effects - 특수 효과
SHADOW: 0x000000, // 그림자 - Drop shadows
GLOW: 0xffffff, // 글로우 - Glow effects
HIGHLIGHT: 0xffff80, // 하이라이트 - Selection highlight
} as const;
// Color utility functions
export const colorUtils = {
/**
* Convert hex color to RGB components
*/
hexToRgb: (hex: number) => ({
r: (hex >> 16) & 255,
g: (hex >> 8) & 255,
b: hex & 255,
}),
/**
* Convert RGB to hex color
*/
rgbToHex: (r: number, g: number, b: number) => {
return (r << 16) | (g << 8) | b;
},
/**
* Blend two colors
*/
blend: (color1: number, color2: number, factor: number) => {
const rgb1 = colorUtils.hexToRgb(color1);
const rgb2 = colorUtils.hexToRgb(color2);
const r = Math.round(rgb1.r + (rgb2.r - rgb1.r) * factor);
const g = Math.round(rgb1.g + (rgb2.g - rgb1.g) * factor);
const b = Math.round(rgb1.b + (rgb2.b - rgb1.b) * factor);
return colorUtils.rgbToHex(r, g, b);
},
};
|