From b8def33b0138522b8b55fa55e2febf1c958fd2a8 Mon Sep 17 00:00:00 2001 From: Jung Sun A Date: Fri, 16 Oct 2026 15:27:22 +0900 Subject: [PATCH] =?UTF-8?q?chore:=20=ED=94=BC=EA=B7=B8=EB=A7=88=20?= =?UTF-8?q?=EB=94=94=EC=9E=90=EC=9D=B8=20=ED=86=A0=ED=81=B0=20=EB=8F=99?= =?UTF-8?q?=EA=B8=B0=ED=99=94?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- tokens/tokens.css | 172 ++++++++++ tokens/tokens.json | 804 +++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 976 insertions(+) create mode 100644 tokens/tokens.css create mode 100644 tokens/tokens.json diff --git a/tokens/tokens.css b/tokens/tokens.css new file mode 100644 index 00000000..66916ce8 --- /dev/null +++ b/tokens/tokens.css @@ -0,0 +1,172 @@ +/* 피그마 → 깃 동기화 플러그인이 생성한 파일이에요. 직접 수정하지 마세요. */ + +@theme { + --color-base-50: #ffffff; + --color-base-950: #000000; + --color-gray-50: #f4f4f6; + --color-gray-75: #e9e9ed; + --color-gray-100: #dcdee2; + --color-gray-200: #c5c8ce; + --color-gray-300: #adb1bb; + --color-gray-400: #959ba7; + --color-gray-500: #7d8594; + --color-gray-600: #686f7e; + --color-gray-700: #545a66; + --color-gray-800: #40454e; + --color-gray-900: #2d3037; + --color-gray-950: #191b1f; + --color-sky-blue-50: #ecf8fe; + --color-sky-blue-100: #c5e9fd; + --color-sky-blue-200: #9edbfd; + --color-sky-blue-300: #76cefd; + --color-sky-blue-400: #4dc1ff; + --color-sky-blue-500: #1baefd; + --color-sky-blue-600: #0494e2; + --color-sky-blue-700: #0473ae; + --color-sky-blue-800: #04527b; + --color-sky-blue-900: #033149; + --color-sky-blue-950: #011018; + --color-red-50: #feedec; + --color-yellow-50: #fefaec; + --color-red-100: #fbc9c8; + --color-red-200: #faa5a2; + --color-red-300: #f9807c; + --color-orange-50: #fef3ec; + --color-yellow-100: #fcf2cb; + --color-orange-100: #fddcc6; + --color-orange-200: #fcc4a0; + --color-orange-300: #fcad79; + --color-yellow-200: #fbebaa; + --color-orange-400: #fc9651; + --color-blue-50: #ecf3fe; + --color-yellow-300: #fae488; + --color-blue-100: #c5dbfb; + --color-blue-200: #9dc3f9; + --color-blue-300: #74abf9; + --color-blue-400: #4a93f9; + --color-blue-500: #1f7af9; + --color-blue-600: #0861de; + --color-blue-700: #084cab; + --color-blue-800: #073679; + --color-blue-900: #052148; + --color-blue-950: #020b18; + --color-yellow-400: #fbdd65; + --color-yellow-500: #f8d031; + --color-red-400: #f95b56; + --color-yellow-600: #e9bd0a; + --color-orange-500: #fd7e29; + --color-yellow-700: #b49109; + --color-green-50: #f0faf6; + --color-green-100: #ceeee2; + --color-green-200: #ace3ce; + --color-green-300: #8ad9bb; + --color-green-400: #67cfa7; + --color-green-500: #44c594; + --color-green-600: #34a57a; + --color-green-700: #2a805f; + --color-yellow-800: #7f6708; + --color-green-800: #1e5b44; + --color-yellow-900: #4b3d05; + --color-green-900: #133729; + --color-yellow-950: #181302; + --color-red-500: #fa352e; + --color-orange-600: #ff6600; + --color-green-950: #07130e; + --color-red-600: #e91008; + --color-red-700: #b30e08; + --color-orange-700: #c35002; + --color-red-800: #7e0b07; + --color-orange-800: #893904; + --color-red-900: #4b0705; + --color-red-950: #180302; + --color-purple-50: #f1eefc; + --color-purple-100: #e4dcf9; + --color-purple-200: #d5caf7; + --color-orange-900: #502203; + --color-purple-300: #b19def; + --color-orange-950: #180a01; + --color-purple-400: #8e70e7; + --color-purple-500: #6a44de; + --color-purple-600: #4d24c9; + --color-purple-700: #3d1d9b; + --color-purple-800: #2b156e; + --color-purple-900: #1a0d41; + --color-purple-950: #090415; + --color-bg-accent: var(--color-sky-blue-500); + --color-bg-warning: var(--color-yellow-50); + --color-bg-error: var(--color-red-50); + --color-bg-success: var(--color-green-50); + --color-bg-informative: var(--color-blue-50); + --color-bg-neutral-primary: var(--color-gray-900); + --color-bg-neutral-secondary: var(--color-gray-800); + --color-bg-neutral-tertiary: var(--color-gray-75); + --color-bg-layer-default: var(--color-base-50); + --color-bg-layer-basement: var(--color-gray-50); + --color-bg-layer-floating: var(--color-base-50); + --color-bg-layer-overlay-40: #00000066; + --color-bg-layer-overlay-20: #00000033; + --color-bg-layer-overlay-12: #0000001f; + --color-bg-layer-overlay-8: #00000014; + --color-bg-layer-overlay-4: #0000000a; + --color-text-accent: var(--color-sky-blue-600); + --color-text-warning: var(--color-yellow-900); + --color-text-error: var(--color-red-600); + --color-text-success: var(--color-green-600); + --color-text-informative: var(--color-blue-600); + --color-text-neutral-primary: var(--color-gray-900); + --color-text-neutral-secondary: var(--color-gray-600); + --color-text-neutral-tertiary: var(--color-gray-300); + --color-text-neutral-inverse: var(--color-base-50); + --color-border-accent: var(--color-sky-blue-400); + --color-border-warning: var(--color-yellow-400); + --color-border-error: var(--color-red-400); + --color-border-success: var(--color-green-400); + --color-border-informative: var(--color-blue-400); + --color-border-neutral-primary: var(--color-gray-700); + --color-border-neutral-secondary: var(--color-gray-500); + --color-border-neutral-tertiary: var(--color-gray-300); + --color-border-neutral-muted: var(--color-gray-75); + --color-icon-accent: var(--color-sky-blue-500); + --color-icon-warning: var(--color-yellow-500); + --color-icon-error: var(--color-red-300); + --color-icon-success: var(--color-green-400); + --color-icon-informative: var(--color-blue-600); + --color-icon-neutral-primary: var(--color-gray-600); + --color-icon-neutral-secondary: var(--color-gray-300); + --color-icon-neutral-inverse: var(--color-base-50); + --weight-regular: "regular"; + --weight-medium: "medium"; + --weight-semibold: "semibold"; + --weight-bold: "bold"; + --size-title-1: 24px; + --size-heading-1: 20px; + --size-heading-2: 18px; + --size-body-1: 16px; + --size-body-2: 14px; + --size-caption-1: 12px; + --line-height-title-1: 32px; + --line-height-heading-1: 28px; + --line-height-heading-2: 26px; + --line-height-body-1: 22px; + --line-height-body-2: 20px; + --line-height-caption-1: 18px; + --letter-spacing-letter-spacing: -0.6000000238418579px; + --letter-spacing-letter-spacing-2: -0.4000000059604645px; + --text: "String value"; + --radius-radius-r1: 4px; + --radius-radius-r2: 8px; + --radius-radius-r3: 12px; + --radius-radius-r4: 16px; + --radius-radius-r5: 20px; + --radius-radius-r6: 24px; + --radius-radius-r7: 28px; + --spacing-spacing-x1: 4px; + --spacing-spacing-x2: 8px; + --spacing-spacing-x3: 12px; + --spacing-spacing-x4: 16px; + --spacing-spacing-x5: 20px; + --spacing-spacing-x6: 24px; + --spacing-spacing-x7: 28px; + --spacing-spacing-x8: 32px; + --spacing-spacing-x9: 36px; +} diff --git a/tokens/tokens.json b/tokens/tokens.json new file mode 100644 index 00000000..981db8c4 --- /dev/null +++ b/tokens/tokens.json @@ -0,0 +1,804 @@ +{ + "$extensions": { + "figma-git-sync": { + "version": 1, + "collections": { + "Atomic": { + "modes": [ + "core" + ], + "defaultMode": "core" + }, + "Sementic": { + "modes": [ + "semantic" + ], + "defaultMode": "semantic" + }, + "Typography": { + "modes": [ + "Mode 1" + ], + "defaultMode": "Mode 1" + }, + "Shape": { + "modes": [ + "Mode 1.tokens 2" + ], + "defaultMode": "Mode 1.tokens 2" + } + } + } + }, + "Atomic": { + "Base": { + "50": { + "$type": "color", + "$value": "#ffffff" + }, + "950": { + "$type": "color", + "$value": "#000000" + } + }, + "Gray": { + "50": { + "$type": "color", + "$value": "#f4f4f6" + }, + "75": { + "$type": "color", + "$value": "#e9e9ed" + }, + "100": { + "$type": "color", + "$value": "#dcdee2" + }, + "200": { + "$type": "color", + "$value": "#c5c8ce" + }, + "300": { + "$type": "color", + "$value": "#adb1bb" + }, + "400": { + "$type": "color", + "$value": "#959ba7" + }, + "500": { + "$type": "color", + "$value": "#7d8594" + }, + "600": { + "$type": "color", + "$value": "#686f7e" + }, + "700": { + "$type": "color", + "$value": "#545a66" + }, + "800": { + "$type": "color", + "$value": "#40454e" + }, + "900": { + "$type": "color", + "$value": "#2d3037" + }, + "950 •": { + "$type": "color", + "$value": "#191b1f" + } + }, + "Sky blue": { + "50": { + "$type": "color", + "$value": "#ecf8fe" + }, + "100": { + "$type": "color", + "$value": "#c5e9fd" + }, + "200": { + "$type": "color", + "$value": "#9edbfd" + }, + "300": { + "$type": "color", + "$value": "#76cefd" + }, + "500": { + "$type": "color", + "$value": "#1baefd" + }, + "600": { + "$type": "color", + "$value": "#0494e2" + }, + "700": { + "$type": "color", + "$value": "#0473ae" + }, + "800": { + "$type": "color", + "$value": "#04527b" + }, + "900": { + "$type": "color", + "$value": "#033149" + }, + "950": { + "$type": "color", + "$value": "#011018" + }, + "400 •": { + "$type": "color", + "$value": "#4dc1ff" + } + }, + "Red": { + "50": { + "$type": "color", + "$value": "#feedec" + }, + "100": { + "$type": "color", + "$value": "#fbc9c8" + }, + "200": { + "$type": "color", + "$value": "#faa5a2" + }, + "300": { + "$type": "color", + "$value": "#f9807c" + }, + "400": { + "$type": "color", + "$value": "#f95b56" + }, + "600": { + "$type": "color", + "$value": "#e91008" + }, + "700": { + "$type": "color", + "$value": "#b30e08" + }, + "800": { + "$type": "color", + "$value": "#7e0b07" + }, + "900": { + "$type": "color", + "$value": "#4b0705" + }, + "950": { + "$type": "color", + "$value": "#180302" + }, + "500 •": { + "$type": "color", + "$value": "#fa352e" + } + }, + "Yellow": { + "50": { + "$type": "color", + "$value": "#fefaec" + }, + "100": { + "$type": "color", + "$value": "#fcf2cb" + }, + "200": { + "$type": "color", + "$value": "#fbebaa" + }, + "300": { + "$type": "color", + "$value": "#fae488" + }, + "500": { + "$type": "color", + "$value": "#f8d031" + }, + "600": { + "$type": "color", + "$value": "#e9bd0a" + }, + "700": { + "$type": "color", + "$value": "#b49109" + }, + "800": { + "$type": "color", + "$value": "#7f6708" + }, + "900": { + "$type": "color", + "$value": "#4b3d05" + }, + "950": { + "$type": "color", + "$value": "#181302" + }, + "400 •": { + "$type": "color", + "$value": "#fbdd65" + } + }, + "Orange": { + "50": { + "$type": "color", + "$value": "#fef3ec" + }, + "100": { + "$type": "color", + "$value": "#fddcc6" + }, + "200": { + "$type": "color", + "$value": "#fcc4a0" + }, + "300": { + "$type": "color", + "$value": "#fcad79" + }, + "400": { + "$type": "color", + "$value": "#fc9651" + }, + "500": { + "$type": "color", + "$value": "#fd7e29" + }, + "700": { + "$type": "color", + "$value": "#c35002" + }, + "800": { + "$type": "color", + "$value": "#893904" + }, + "900": { + "$type": "color", + "$value": "#502203" + }, + "950": { + "$type": "color", + "$value": "#180a01" + }, + "600 •": { + "$type": "color", + "$value": "#ff6600" + } + }, + "Blue": { + "50": { + "$type": "color", + "$value": "#ecf3fe" + }, + "100": { + "$type": "color", + "$value": "#c5dbfb" + }, + "200": { + "$type": "color", + "$value": "#9dc3f9" + }, + "300": { + "$type": "color", + "$value": "#74abf9" + }, + "400": { + "$type": "color", + "$value": "#4a93f9" + }, + "600": { + "$type": "color", + "$value": "#0861de" + }, + "700": { + "$type": "color", + "$value": "#084cab" + }, + "800": { + "$type": "color", + "$value": "#073679" + }, + "900": { + "$type": "color", + "$value": "#052148" + }, + "950": { + "$type": "color", + "$value": "#020b18" + }, + "500 •": { + "$type": "color", + "$value": "#1f7af9" + } + }, + "Green": { + "50": { + "$type": "color", + "$value": "#f0faf6" + }, + "100": { + "$type": "color", + "$value": "#ceeee2" + }, + "200": { + "$type": "color", + "$value": "#ace3ce" + }, + "300": { + "$type": "color", + "$value": "#8ad9bb" + }, + "400": { + "$type": "color", + "$value": "#67cfa7" + }, + "600": { + "$type": "color", + "$value": "#34a57a" + }, + "700": { + "$type": "color", + "$value": "#2a805f" + }, + "800": { + "$type": "color", + "$value": "#1e5b44" + }, + "900": { + "$type": "color", + "$value": "#133729" + }, + "950": { + "$type": "color", + "$value": "#07130e" + }, + "500 •": { + "$type": "color", + "$value": "#44c594" + } + }, + "Purple": { + "50": { + "$type": "color", + "$value": "#f1eefc" + }, + "100": { + "$type": "color", + "$value": "#e4dcf9" + }, + "300": { + "$type": "color", + "$value": "#b19def" + }, + "400": { + "$type": "color", + "$value": "#8e70e7" + }, + "500": { + "$type": "color", + "$value": "#6a44de" + }, + "600": { + "$type": "color", + "$value": "#4d24c9" + }, + "700": { + "$type": "color", + "$value": "#3d1d9b" + }, + "800": { + "$type": "color", + "$value": "#2b156e" + }, + "900": { + "$type": "color", + "$value": "#1a0d41" + }, + "950": { + "$type": "color", + "$value": "#090415" + }, + "200 •": { + "$type": "color", + "$value": "#d5caf7" + } + } + }, + "Sementic": { + "bg": { + "accent": { + "$type": "color", + "$value": "{Atomic.Sky blue.500}" + }, + "warning": { + "$type": "color", + "$value": "{Atomic.Yellow.50}" + }, + "error": { + "$type": "color", + "$value": "{Atomic.Red.50}" + }, + "success": { + "$type": "color", + "$value": "{Atomic.Green.50}" + }, + "informative": { + "$type": "color", + "$value": "{Atomic.Blue.50}" + }, + "neutral": { + "primary": { + "$type": "color", + "$value": "{Atomic.Gray.900}", + "$description": "앱 메인 배경" + }, + "secondary": { + "$type": "color", + "$value": "{Atomic.Gray.800}", + "$description": "카드·섹션 배경" + }, + "tertiary": { + "$type": "color", + "$value": "{Atomic.Gray.75}", + "$description": "한 단계 더 깊은 배경" + } + }, + "layer": { + "default": { + "$type": "color", + "$value": "{Atomic.Base.50}", + "$description": "앱 메인 배경" + }, + "basement": { + "$type": "color", + "$value": "{Atomic.Gray.50}", + "$description": "카드·섹션 배경" + }, + "floating": { + "$type": "color", + "$value": "{Atomic.Base.50}", + "$description": "한 단계 더 깊은 배경" + }, + "overlay-40": { + "$type": "color", + "$value": "#00000066", + "$description": "한 단계 더 깊은 배경" + }, + "overlay-20": { + "$type": "color", + "$value": "#00000033", + "$description": "한 단계 더 깊은 배경" + }, + "overlay-12": { + "$type": "color", + "$value": "#0000001f", + "$description": "한 단계 더 깊은 배경" + }, + "overlay-8": { + "$type": "color", + "$value": "#00000014", + "$description": "한 단계 더 깊은 배경" + }, + "overlay-4": { + "$type": "color", + "$value": "#0000000a", + "$description": "한 단계 더 깊은 배경" + } + } + }, + "text": { + "accent": { + "$type": "color", + "$value": "{Atomic.Sky blue.600}" + }, + "warning": { + "$type": "color", + "$value": "{Atomic.Yellow.900}" + }, + "error": { + "$type": "color", + "$value": "{Atomic.Red.600}" + }, + "success": { + "$type": "color", + "$value": "{Atomic.Green.600}" + }, + "informative": { + "$type": "color", + "$value": "{Atomic.Blue.600}" + }, + "neutral": { + "primary": { + "$type": "color", + "$value": "{Atomic.Gray.900}", + "$description": "본문·기본 텍스트" + }, + "secondary": { + "$type": "color", + "$value": "{Atomic.Gray.600}", + "$description": "본문·기본 텍스트" + }, + "tertiary": { + "$type": "color", + "$value": "{Atomic.Gray.300}", + "$description": "본문·기본 텍스트" + }, + "inverse": { + "$type": "color", + "$value": "{Atomic.Base.50}", + "$description": "본문·기본 텍스트" + } + } + }, + "border": { + "accent": { + "$type": "color", + "$value": "{Atomic.Sky blue.400 •}" + }, + "warning": { + "$type": "color", + "$value": "{Atomic.Yellow.400 •}" + }, + "error": { + "$type": "color", + "$value": "{Atomic.Red.400}" + }, + "success": { + "$type": "color", + "$value": "{Atomic.Green.400}" + }, + "informative": { + "$type": "color", + "$value": "{Atomic.Blue.400}" + }, + "neutral": { + "primary": { + "$type": "color", + "$value": "{Atomic.Gray.700}", + "$description": "카드·인풋 보더" + }, + "secondary": { + "$type": "color", + "$value": "{Atomic.Gray.500}", + "$description": "카드·인풋 보더" + }, + "tertiary": { + "$type": "color", + "$value": "{Atomic.Gray.300}", + "$description": "카드·인풋 보더" + }, + "muted": { + "$type": "color", + "$value": "{Atomic.Gray.75}", + "$description": "카드·인풋 보더" + } + } + }, + "icon": { + "accent": { + "$type": "color", + "$value": "{Atomic.Sky blue.500}", + "$description": "카드·인풋 보더" + }, + "warning": { + "$type": "color", + "$value": "{Atomic.Yellow.500}", + "$description": "카드·인풋 보더" + }, + "error": { + "$type": "color", + "$value": "{Atomic.Red.300}", + "$description": "카드·인풋 보더" + }, + "success": { + "$type": "color", + "$value": "{Atomic.Green.400}", + "$description": "카드·인풋 보더" + }, + "informative": { + "$type": "color", + "$value": "{Atomic.Blue.600}", + "$description": "카드·인풋 보더" + }, + "neutral": { + "primary": { + "$type": "color", + "$value": "{Atomic.Gray.600}", + "$description": "카드·인풋 보더" + }, + "secondary": { + "$type": "color", + "$value": "{Atomic.Gray.300}", + "$description": "카드·인풋 보더" + }, + "inverse": { + "$type": "color", + "$value": "{Atomic.Base.50}", + "$description": "카드·인풋 보더" + } + } + } + }, + "Typography": { + "weight": { + "regular": { + "$type": "string", + "$value": "regular" + }, + "medium": { + "$type": "string", + "$value": "medium" + }, + "semibold": { + "$type": "string", + "$value": "semibold" + }, + "bold": { + "$type": "string", + "$value": "bold" + } + }, + "size": { + "title": { + "1": { + "$type": "number", + "$value": 24 + } + }, + "heading": { + "1": { + "$type": "number", + "$value": 20 + }, + "2": { + "$type": "number", + "$value": 18 + } + }, + "body": { + "1": { + "$type": "number", + "$value": 16 + }, + "2": { + "$type": "number", + "$value": 14 + } + }, + "caption": { + "1": { + "$type": "number", + "$value": 12 + } + } + }, + "line-height": { + "title": { + "1": { + "$type": "number", + "$value": 32 + } + }, + "heading": { + "1": { + "$type": "number", + "$value": 28 + }, + "2": { + "$type": "number", + "$value": 26 + } + }, + "body": { + "1": { + "$type": "number", + "$value": 22 + }, + "2": { + "$type": "number", + "$value": 20 + } + }, + "caption": { + "1": { + "$type": "number", + "$value": 18 + } + } + }, + "letter-spacing": { + "letter-spacing": { + "$type": "number", + "$value": -0.6000000238418579 + }, + "letter-spacing 2": { + "$type": "number", + "$value": -0.4000000059604645 + } + }, + "Text": { + "$type": "string", + "$value": "String value" + } + }, + "Shape": { + "Radius": { + "Radius-r1": { + "$type": "number", + "$value": 4 + }, + "Radius-r2": { + "$type": "number", + "$value": 8 + }, + "Radius-r3": { + "$type": "number", + "$value": 12 + }, + "Radius-r4": { + "$type": "number", + "$value": 16 + }, + "Radius-r5": { + "$type": "number", + "$value": 20 + }, + "Radius-r6": { + "$type": "number", + "$value": 24 + }, + "Radius-r7": { + "$type": "number", + "$value": 28 + } + }, + "Spacing": { + "Spacing -x1": { + "$type": "number", + "$value": 4 + }, + "Spacing -x2": { + "$type": "number", + "$value": 8 + }, + "Spacing -x3": { + "$type": "number", + "$value": 12 + }, + "Spacing -x4": { + "$type": "number", + "$value": 16 + }, + "Spacing -x5": { + "$type": "number", + "$value": 20 + }, + "Spacing -x6": { + "$type": "number", + "$value": 24 + }, + "Spacing -x7": { + "$type": "number", + "$value": 28 + }, + "Spacing -x8": { + "$type": "number", + "$value": 32 + }, + "Spacing -x9": { + "$type": "number", + "$value": 36 + } + } + } +}