ììì íì 깚ì°ìžì! 볞 ê°ìŽëë ìì± ìŽë¡ ì ì늬륌 í구íê³ , ì ìžê³ ë€ìí 묞íì ì°ì ì ê±žì³ ëììž, ë§ìŒí , ìì ë¶ìŒìì íšê³Œì ìŒë¡ íì©íë ë°©ë²ì ì ìí©ëë€.
ìì íŽë : ìì± ìŽë¡ 곌 êžë¡ë² íì©ì ëí ì¢ í© ê°ìŽë
ìì ê°ë ¥í ë구ì ëë€. ê°ì ì ìí¥ì 믞ì¹ê³ , ìžìì íì±íë©°, 믞ë¬íì§ë§ íšê³Œì ìŒë¡ ë©ìì§ë¥Œ ì ë¬í©ëë€. ìì± ìŽë¡ ì ìŽíŽíë ê²ì ëììž, ë§ìŒí , ìì ëë ìê°ì 컀뮀ëìŒìŽì ìŽ íµì¬ì ìž ìí ì íë 몚ë ë¶ìŒì ì¢ ì¬íë ì¬ëìê² íìì ì ëë€. ìŽ ì¢ í© ê°ìŽëë ìì± ìŽë¡ ì Ʞ볞ì ê¹ìŽ íê³ ë€ìŽ ë€ìí êžë¡ë² ë§¥ëœììì ì€ì ì ìž ì ì© ë°©ë²ì í구í ê²ì ëë€.
ìì± ìŽë¡ ìŽë 묎ììžê°?
ìì± ìŽë¡ ì ìì íŒí© ë° í¹ì ìì ì¡°í©ì ìê°ì íšê³Œì ëí ì€ì©ì ìž ì§ì¹šì ì§í©ì²Žì ëë€. ìŽê²ì ììí, ìŠ ììë€ì ìì¡° êŽê³ì ë°ëŒ ë°°ìŽë ìê°ì ííì êž°ë°ìŒë¡ ìì ê°ì êŽê³ë¥Œ ì ìí©ëë€.
ììí: ë¹ì ì ìê°ì ê°ìŽë
ììíì ìì± ìŽë¡ ì êž°ìŽì ëë€. ìŒë°ì ìŒë¡ 12ê°ì§ ìì, ìŠ 1ì°šì, 2ì°šì, 3ì°šììŒë¡ 구ì±ë©ëë€. ìŽë€ì ë°°ì¹ì êŽê³ë¥Œ ìŽíŽíë ê²ìŽ ì€ìí©ëë€.
- 1ì°šì: 빚ê°, ë žë, íë. ìŽ ìë€ì ë€ë¥ž ìì íŒí©íì¬ ë§ë€ ì ììµëë€. 몚ë ë€ë¥ž ìì êž°ìŽê° ë©ëë€.
- 2ì°šì: ìŽë¡, 죌í©, 볎ëŒ. ë ê°ì 1ì°šìì íŒí©íì¬ ë§ëëë€ (ì: ë¹šê° + ë žë = 죌í©).
- 3ì°šì: 1ì°šì곌 ìŽìí 2ì°šìì íŒí©íì¬ ë§ëëë€ (ì: ë¹šê° + ì£Œí© = ë€íì).
ìì êŽê³ ìŽíŽíêž°
ììíì ë°°ì ëë ìì± ì¡°íëŒê³ ë ìë €ì§ ë€ìí ìì êŽê³ë¥Œ ìŽíŽíë ë° ëììŽ ë©ëë€. ê° ë°°ìì ë€ë¥ž ìê°ì íšê³Œë¥Œ ë§ë€ê³ ë€ë¥ž ê°ì ì ë¶ë¬ìŒìŒíµëë€.
ìŒë°ì ìž ë°°ì êž°ë²
- ëšì ë°°ì (Monochromatic): ëšìŒ ììì ì±ëì ëª ë륌 ë³ê²œíì¬ ë³íì ì¬ì©í©ëë€. ì¡°íì íµìŒê°ì ë§ëëë€. ìì: ì°šë¶íê³ ì ë¢°ê° ìë ëëì 죌Ʞ ìíŽ ì¹ì¬ìŽíž ëììžì ë€ìí íëì ììì ì¬ì©íë 겜ì°.
- ì ì¬ì ë°°ì (Analogous): ììíìì ìë¡ ìžì í ììì ì¬ì©í©ëë€. ì¡°íë¡ê³ 볎Ʞ ì¢ì íšê³Œë¥Œ ë§ëëë€. ìì: ìŽë¡, ì°ë, ë žëì ì¬ì©íì¬ ìì°ìì ìê°ì ë°ì ëììžì ë§ëë 겜ì°.
- 볎ì ë°°ì (Complementary): ììíìì ìë¡ ë°ëížì ìë ììì ì¬ì©í©ëë€. ëì ëë¹ì ìê°ì í¥ë¯žë¥Œ ì ë°í©ëë€. ìì: ìì ì ì¬ë¡ì¡êž° ìíŽ ë§ìŒí ìº íìžì íëì곌 죌í©ìì ì¬ì©íë 겜ì°.
- ë¶í 볎ì ë°°ì (Split-Complementary): í ê°ì§ ìì곌 ê·ž 볎ìì ììì ìë ë ê°ì§ ììì ì¬ì©í©ëë€. 볎ìì²ëŒ ëì ëë¹ë¥Œ ì ê³µíì§ë§ ꞎì¥ê°ì ëí©ëë€. ìì: ìœíì íëì, ë žë-죌í©, 빚ê°-죌í©ì ì¬ì©íë 겜ì°.
- ìŒì ë°°ì (Triadic): ììíìì ëìŒí ê°ê²©ìŒë¡ ë°°ì¹ë ìž ê°ì§ ììì ì¬ì©í©ëë€. ìëê° ìê³ ê· í ì¡í íšê³Œë¥Œ ë§ëëë€. ìì: ìŽëŠ°ìŽ ì¥ëê° ëììžì 빚ê°, ë žë, íëì ì¬ì©íë 겜ì°.
- ì¬ê°í ë°°ì (Tetradic / Square): ë ê°ì 볎ì ììŒë¡ ë°°ìŽë ë€ ê°ì§ ììì ì¬ì©í©ëë€. íë¶íê³ ë€ìí íë ížë¥Œ ì ê³µíì§ë§ ì ì€í ê· íìŽ íìí©ëë€. ìì: ë³µì¡í ê·žëíœ ëììžì 빚ê°, ìŽë¡, íë, 죌í©ì ì¬ì©íë 겜ì°.
ìì ëª ëì ì±ë: ëª ì, ìì, í€
ìì ê°ì ì¡°ìíë ë°©ë²ì ìŽíŽíë ê²ì ëììžì ê¹ìŽì ì 첎ê°ì ë§ëë ë° ì€ìí©ëë€.
- ëª ì (Tint): ìì í°ìì ëíë ê². ìì ë ë°ê² ë§ëëë€.
- ìì (Shade): ìì ê²ììì ëíë ê². ìì ë ìŽë¡ê² ë§ëëë€.
- í€ (Tone): ìì íìì ëíë ê². ìì ì±ë륌 ë®ì¶¥ëë€.
ìì± ì¬ëЬí: ììŽ ì°ëЬìê² ë¯žì¹ë ìí¥
ìì ê°ì 곌 ì°ìì ë¶ë¬ìŒìŒí€ì§ë§, ìŽë 묞íì ë°ëŒ ë€ë¥Œ ì ììµëë€. ìì± ì¬ëЬíì ìŽíŽí멎 íê² ê³ ê°ìê² ê³µê°ì ì»ê³ ìíë íšê³Œë¥Œ ë¬ì±íë ììì ì ííë ë° ëììŽ ë ì ììµëë€.
ìŒë°ì ìž ìì ì°ì (볎ížì 겜í¥)
- 빚ê°: ìëì§, ìŽì , í¥ë¶, ìí, ë¶ë ž. ë§ìŒí ìì ꞎêžíšì ì¡°ì±íë ë° ì죌 ì¬ì©ë©ëë€.
- íë: ì 뢰, ìì , íìš, ê¶ì, ì 묞ì±. êž°ì ëžëë© ë° êž°ì ë¶ìŒìì ìŒë°ì ìŒë¡ ì¬ì©ë©ëë€.
- ìŽë¡: ìì°, ì±ì¥, 걎ê°, ë¶, ì¡°í. ì¹í겜 ëžëë ë° ìë£ ë¶ìŒìì ì죌 ì¬ì©ë©ëë€.
- ë žë: íë³µ, ëêŽ, ìëì§, ë°ë»íš, 죌ì. ìì ì ëê³ ëª ëí ë¶ìꞰ륌 ì¡°ì±íë ë° ì¬ì©ë©ëë€.
- 죌í©: ìŽì , ì°œìì±, ìëì§, ë°ë»íš, 겜ì ì±. ì ì ìžµì ëììŒë¡ íë ë§ìŒí ìì ì죌 ì¬ì©ë©ëë€.
- 볎ëŒ: ê³ êžì€ë¬ì, ì족, ì°œìì±, ìì±, ì ë¹. ë·°í° ë° ê³ êž ì íì ì죌 ì¬ì©ë©ëë€.
- ë¶í: ì¬ì±ì±, ì¬ë, ë¡ë§šì€, ë¬ìœ€íš, ìì. ì¬ì± ë° ìŽëаìŽë¥Œ ëììŒë¡ íë ì íì ì죌 ì¬ì©ë©ëë€.
- ê°ì: í, ìì , ížìíš, ì 뢰ì±, ë°ë»íš. ìë°íê±°ë ìì°ì€ë¬ìŽ ëëì ë§ëë ë° ì죌 ì¬ì©ë©ëë€.
- ê²ì : ìžë šëš, í, ì°ìíš, ì ë¹, 격ì. ëì 늬 ëžëë ë° ë¯žëë©ëЬì€íž ëììžì ì죌 ì¬ì©ë©ëë€.
- í°ì: ìì, ì²ê²°, ëšìíš, ìì, íí. 믞ëë©ëЬì€íž ëììž ë° ìë£ ë¶ìŒìì ì죌 ì¬ì©ë©ëë€.
ìì ëí êžë¡ë² êŽì
ìì ì믞ì ì°ìì 묞íì ë°ëŒ í¬ê² ë€ëŠ ëë€. ìëì¹ ìì ë¶ìŸê°ìŽë ì€íŽë¥Œ íŒíë €ë©Ž êžë¡ë² ê³ ê°ì ëììŒë¡ ëììží ë 묞íì ë§¥ëœì ê³ ë €íë ê²ìŽ ì€ìí©ëë€. í 묞íìì êžì ì ìž ìììŽ ë€ë¥ž 묞íììë ë¶ì ì ìž ì믞륌 ê°ì§ ì ììµëë€.
ì ìžìì ëí 묞íì ì°šìŽì ì
- í°ì: ìì 묞íìì í°ìì ì¢ ì¢ ìê²°ì ìì§íë©° ê²°íŒì곌 êŽë šìŽ ììµëë€. ìŒë¶ ëì 묞íììë í°ììŽ ì ë ë° ì¥ë¡ì곌 êŽë šìŽ ììµëë€.
- 빚ê°: ë§ì ìì 묞íìì 빚ê°ì ìŽì 곌 í¥ë¶ì ìì§í©ëë€. ì€êµìì 빚ê°ì íìŽê³Œ ë²ìì ìì§íë©° ì¶í íì¬ìì ìžêž° ìë ììì ëë€. ê·žë¬ë ìŒë¶ ìí늬칎 묞íìì 빚ê°ì ì ë륌 ìì§í ì ììµëë€.
- 볎ëŒ: ìì 묞íìì 볎ëŒë ì¢ ì¢ ì족곌 ê³ êžì€ë¬ì곌 êŽë šìŽ ììµëë€. íêµììë 볎ëŒê° ì ëì êŽë šìŽ ììµëë€. ìŒë¶ ëŒíŽ ìë©ëŠ¬ì¹Ž êµê°ììë 죜ì곌 êŽë šìŽ ììµëë€.
- ìŽë¡: ììììë ì¢ ì¢ ìì° ë° í겜곌 êŽë šìŽ ìì§ë§, ìŒë¶ ë€ë¥ž 묞íììë ì§ë³ê³Œ êŽë šë ì ììµëë€.
- ë žë: ë§ì ìì 묞íìì í복곌 ëêŽì ëíëŽì§ë§, ìŒë¶ ë§¥ëœììë ë¹ê²íšì ì믞í ì ììµëë€.
ì€í ê°ë¥í íµì°°ë ¥: êžë¡ë² ë§ìŒí ìº íìžìŽë ì íì ì¶ìíêž° ì ì ê° íê² ìì¥ìì ì íí ììì 묞íì ì€ìì±ì ì¡°ì¬íììì€. ìì ì íìŽ ì ì íê³ ë¬žíì ìŒë¡ 믌ê°íì§ íìžíêž° ìíŽ íì§ ì 묞ê°ì ìëŽíììì€.
ëììžì ìì± ìŽë¡ ì ì©íêž°
ìì± ìŽë¡ ì ëšìí ì¶ìì ìž ê°ë ìŽ ìëëŒ ë€ìí ëììž ë¶ìŒì ì ì©í ì ìë ì€ì©ì ìž ë구ì ëë€.
ì¹ ëììž ë° UI/UX
ìì ë§€ë ¥ì ìŽê³ ì¬ì©ì ì¹íì ìž ì¹ì¬ìŽížì ì í늬ìŒìŽì ì ë§ëë ë° ì€ìí ìí ì í©ëë€.
- ëžëë©: ëžëëì ê°ì±ê³Œ ê°ì¹ë¥Œ ë°ìíë ììì ì¬ì©íììì€. 몚ë íë«íŒìì ìŒêŽë ìì ì¬ì©ì ëžëë ìžì§ë륌 ê°íí©ëë€.
- ì¬ì©ì±: ììì ì¬ì©íì¬ ì¬ì©ì륌 ìží°íìŽì€ë¥Œ íµíŽ ìëŽíê³ , ì€ìí ìì륌 ê°ì¡°íë©°, íŒëë°±ì ì ê³µíììì€. í¹í ìê° ì¥ì ê° ìë ì¬ì©ì륌 ìíŽ ê°ë ì±ì ìí ì¶©ë¶í ìì ëë¹ë¥Œ 볎ì¥íììì€.
- ì ê·Œì±: ìë§¹ì í¬íší 몚ë ì¬ëìŽ ì¹ì¬ìŽížë¥Œ ì¬ì©í ì ìëë¡ ìì ëë¹ì êŽí ì ê·Œì± ê°ìŽëëŒìž(WCAG)ì ì€ìíììì€. WebAIMì ìì ëë¹ ê²ì¬êž°ì ê°ì ëêµ¬ê° ëììŽ ë ì ììµëë€.
- ìì: êžìµ êž°êŽì ì 뢰ì ìì ì ì ë¬íêž° ìíŽ íëì곌 íìì ì¬ì©í ì ììŒë©°, í¬ëЬììŽí°ëž ììŽì ìë íì ì ìž ì ì ì 볎ì¬ì£Œêž° ìíŽ ë ëëŽíê³ ììí ììì ì¬ì©í ì ììµëë€.
ê·žëíœ ëììž ë° ëžëë©
ìì ìê°ì ìŒë¡ ë§€ë ¥ì ìŽê³ êž°ìµì ëšë ë¡ê³ , ë§ìŒí ìë£ ë° êž°í ê·žëíœ ëììžì ë§ëë ë° íìì ì ëë€.
- ë¡ê³ ëììž: ëžëëì íµì¬ ê°ì¹ë¥Œ ëíëŽê³ 겜ìì¬ì ì°šë³íëë ììì ì ííììì€. ê° ììì ì¬ëЬì ìí¥ê³Œ 묞íì ì°êŽì±ì ê³ ë €íììì€.
- ë§ìŒí ìë£: ììì ì¬ì©íì¬ ìê°ì ê³ìžµ 구조륌 ë§ë€ê³ , íµì¬ ë©ìì§ì 죌ì륌 ëë©°, ìíë ê°ì ì ë¶ë¬ìŒìŒí€ììì€. 몚ë ë§ìŒí ì±ëìì ìŒêŽë ìì ì¬ì©ì ëžëë ì 첎ì±ì ê°íí©ëë€.
- ìì: ìœì¹ŽìœëŒ ë¡ê³ ë í¥ë¶ê³Œ ìëì§ë¥Œ ì ë¬íêž° ìíŽ ë¹šê°ìì ì¬ì©íê³ , ì€íë² ì€ ë¡ê³ ë ìì°ê³Œ ì±ì¥ì ëíëŽêž° ìíŽ ìŽë¡ìì ì¬ì©í©ëë€.
ìží ëŠ¬ìŽ ëììž
ìì ê³µê°ì ë¶ìꞰ륌 ë³íììŒ êž°ë¶ê³Œ íëì ìí¥ì ì€ ì ììµëë€.
- ë°©ì êž°ë¥: ë°©ì êž°ë¥ì ì í©í ììì ì ííììì€. ì륌 ë€ìŽ, ì°šë¶í íëì곌 ìŽë¡ìì ì¢ ì¢ ì¹šì€ì ì¬ì©ëë©°, íêž°ì°¬ ë žëì곌 죌í©ìì 죌방ì ì¬ì©ë©ëë€.
- ë°©ì í¬êž°: ìì ë°©ì ë í¬ê³ ëìŽ ë³ŽìŽê² íë €ë©Ž ë°ì ììì ì¬ì©íê³ , í° ë°©ì ë ìëíê³ ì¹ë°íê² ë³ŽìŽê² íë €ë©Ž ìŽëìŽ ììì ì¬ì©íììì€.
- ê°ìžì ì ížë: ì§ì ììì ì íí ë ê°ìžì ìž ì ížëì ìíë ë¶ìꞰ륌 ê³ ë €íììì€.
- ìì: ë³ì ëêž°ì€ì ë¶ìì ì€ìŽêž° ìíŽ ì°šë¶í íëì곌 ìŽë¡ìì ì¬ì©í ì ììŒë©°, ë ì€í ëì ììì ìê·¹íêž° ìíŽ ë¹šê°ì곌 죌í©ì곌 ê°ì ë°ë»í ììì ì¬ì©í ì ììµëë€.
ìì ë° ìŒë¬ì€ížë ìŽì
ìì ìì ì Ʞ볞 ììë¡, ë¶ìꞰ륌 ì¡°ì±íê³ ê°ì ì íííë©° íì€ì ëíëŽë ë° ì¬ì©ë©ëë€.
- ìì íŒí©: ë€ìí ìì¡°, ëª ì, ìì, í€ì ë§ë€êž° ìíŽ ìì íŒí© êž°ì ì ë§ì€í°íììì€. ìíë íšê³Œë¥Œ ì»êž° ìíŽ ë€ìí ìì ì¡°í©ì ì€ííŽ ë³Žììì€.
- ìì± ì¡°í: ë°°ì êž°ë²ì ì¬ì©íì¬ ìê°ì ìŒë¡ ìŠê²ê³ ê· í ì¡í 구ì±ì ë§ëììì€. ë€ìí ìì ì¡°í©ì ê°ì ì ìí¥ì ê³ ë €íììì€.
- ê°ìž ì€íìŒ: ìì ë§ì ë í¹í ìì íë ížì ì€íìŒì ê°ë°íììì€. ìì ìê² ê°ì¥ ì í©í ê²ì ì°Ÿêž° ìíŽ ë€ìí êž°ì 곌 ì ê·Œ ë°©ìì ì€ííŽ ë³Žììì€.
- ìì: íŽë¡ë 몚ë€ì ê°ì ìžìí íê°ë€ì ë¹ê³Œ ëêž°ì ìê°ì ìž íšê³Œë¥Œ í¬ì°©íêž° ìíŽ ìì ì¬ì©íìŒë©°, ìëë°ë¥Ž ëí¬ì ê°ì íí죌ì íê°ë€ì ê°ë ¬í ê°ì ì íííêž° ìíŽ ìì ì¬ì©íìµëë€.
ìì± ìŽë¡ ì ìí ë구 ë° ìë£
ìë§ì ìšëŒìž ë구ì ìë£ê° ìì± ìŽë¡ ì í구íê³ íšê³Œì ìž ìì íë ížë¥Œ ë§ëë ë° ëìì ì€ ì ììµëë€.
- Adobe Color: ìì íë ížë¥Œ ë§ë€ê³ íìíêž° ìí ì¹ êž°ë° ë구ì ëë€. ë€ìí ìì ê·ì¹(ì ì¬ì, ëšì, ìŒì ë±)ì ë°ëŒ íë ížë¥Œ ìì±íê³ Adobe Creative Suite ì í늬ìŒìŽì ìì ì¬ì©íêž° ìíŽ ì ì¥í ì ììµëë€.
- Coolors: ë¹ ë¥Žê³ ì¬ì©íêž° ì¬ìŽ ìì íë íž ìì±êž°ì ëë€. 묎ìì íë ížë¥Œ ì ìíê² ë§ë€ê±°ë ì·ší¥ì ë§ê² ë€ë¬ì ì ììµëë€.
- Paletton: ë³µì¡í ë°°ìì ë§ë€êž° ìí ê³ êž êž°ë¥ì ê°ì¶ ì êµí ìì íë íž ìì±êž°ì ëë€.
- Color Hunt: ìê°ì ìí ìëŠë€ìŽ ìì íë ížì íë ìŽì 컬ë ì ì ëë€.
- WebAIM Color Contrast Checker: ì ê·Œì±ì 볎ì¥íêž° ìíŽ ì 겜ì곌 배겜ì ê°ì ìì ëë¹ ë¹ìšì íìžíë ë구ì ëë€.
ê²°ë¡ : ìì ìžìŽ ë§ì€í°íêž°
ìì± ìŽë¡ ì ìê°ì 컀뮀ëìŒìŽì ì ì¢ ì¬íë 몚ë ì¬ëìê² êž°ë³žì ìž êž°ì ì ëë€. ìì êŽê³, ì¬ëЬí ë° ë¬žíì ë§¥ëœì ì늬륌 ìŽíŽíšìŒë¡ìš, íê² ê³ ê°ìê² ê³µê°ì ë¶ë¬ìŒìŒí€ë ìí¥ë ¥ ìë ëììž, ë§ìŒí ìº íìž, ìì ìíì íšê³Œì ìŒë¡ ë§ë€ ì ììµëë€. íì ìì ì íì êžë¡ë²í ìí¥ì ê³ ë €íê³ , ë€ìí 묞íì 배겜ì ê±žì³ íšê³Œì ìž ì ê·Œì± ìê³ í¬ì©ì ìž ëììžì ë§ë€êž° ìíŽ ë žë ¥íììì€. ì§ìì ìž íìµê³Œ ì€íì ìì ìžìŽë¥Œ ë§ì€í°íê³ ê·ž ì ì¬ë ¥ì ìµëí ë°ííë ìŽì ì ëë€.
ìŽ ê°ìŽëë ìì± ìŽë¡ ì ëí ííí êž°ìŽë¥Œ ì ê³µíì§ë§, ë ê¹ì í구ì ì°ìµì ê¶ì¥í©ëë€. ë€ìí ë°°ìì í구íê³ , ìì íŒí©ì ì€ííë©°, ë€ìí ëììžê³Œ ìì ìíìì ìì ì¬ì©ì ë¶ìíììì€. ìì ëí ìŽíŽë¥Œ ì§ìì ìŒë¡ ë€ë¬ììŒë¡ìš, ë¹ì ì ë©ìì§ë¥Œ ìžê³ì íšê³Œì ìŒë¡ ì ë¬íë ìê°ì ìŒë¡ ëëê³ ìí¥ë ¥ ìë ìíì ë§ë€ ì ìì ê²ì ëë€.