@bestow-ui/tokens 0.8.1 → 0.9.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Dev-BestOW
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,67 @@
+# @bestow-ui/tokens
+
+[![npm](https://img.shields.io/npm/v/@bestow-ui/tokens)](https://www.npmjs.com/package/@bestow-ui/tokens)
+[![license](https://img.shields.io/npm/l/@bestow-ui/tokens)](https://github.com/Dev-BestOW/BestOW-UI/blob/main/LICENSE)
+
+Design tokens for **BestOW UI** — colors, spacing, radius, typography, shadow, duration and z-index as plain JavaScript values.
+No dependencies, framework-agnostic.
+
+📖 **See every token:** [Storybook › Foundations › Design Tokens](https://dev-bestow.github.io/BestOW-UI/?path=/story/foundations-design-tokens--colors)
+
+> 🇰🇷 한국어 안내는 [아래](#한국어)에 있어요.
+
+## Install
+
+```bash
+npm install @bestow-ui/tokens
+```
+
+## Usage
+
+```ts
+import { palette, space, radius, fontSize, lightColors, darkColors } from '@bestow-ui/tokens';
+
+space[4]; // '16px'
+radius.md; // '8px'
+lightColors.primary.solid; // '#2554eb'
+darkColors.fg.default; // '#f8f9fa'
+```
+
+| Export | Contents |
+|---|---|
+| `palette` | Raw color scales (`gray`, `blue`, `red`, `green`, `amber`, `white`, `black`) |
+| `lightColors`, `darkColors` | Semantic colors (`bg`, `fg`, `border`, `primary`, `neutral`, `danger`, `success`, `warning`) — same keys in both modes |
+| `space` | `0`–`16` (4px grid) |
+| `radius` | `none`, `sm`, `md`, `lg`, `xl`, `full` |
+| `fontFamily`, `fontSize`, `fontWeight`, `lineHeight` | Typography |
+| `shadow`, `darkShadow` | Elevation for light / dark mode (same keys) |
+| `duration`, `zIndex` | Motion and stacking order |
+
+### Using with React
+
+If you use [`@bestow-ui/react`](https://www.npmjs.com/package/@bestow-ui/react), reference tokens through its theme instead of raw values,
+so dark mode and brand themes apply automatically:
+
+```ts
+import { vars } from '@bestow-ui/react'; // vars.color.primary.solid → var(--bestow-color-primary-solid)
+```
+
+## License
+
+[MIT](https://github.com/Dev-BestOW/BestOW-UI/blob/main/LICENSE) © Dev-BestOW
+
+---
+
+## 한국어
+
+**BestOW UI** 의 디자인 토큰이에요. 색상·간격·모서리·타이포그래피·그림자·시간·z-index 를 순수 JavaScript 값으로 제공해요. 의존성이 없어서 어떤 프레임워크에서도 쓸 수 있어요.
+
+```ts
+import { space, lightColors } from '@bestow-ui/tokens';
+
+space[4]; // '16px'
+lightColors.primary.solid; // '#2554eb'
+```
+
+`@bestow-ui/react` 를 쓴다면 원시 값 대신 `vars`(CSS 변수)로 참조해야 다크 모드·브랜드 테마가 적용돼요.
+전체 토큰은 [Storybook 디자인 토큰 페이지](https://dev-bestow.github.io/BestOW-UI/?path=/story/foundations-design-tokens--colors) 에서 볼 수 있어요.

package/dist/index.cjs

@@ -21,6 +21,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var index_exports = {};
 __export(index_exports, {
   darkColors: () => darkColors,
+  darkShadow: () => darkShadow,
   duration: () => duration,
   fontFamily: () => fontFamily,
   fontSize: () => fontSize,
@@ -86,6 +87,18 @@ var palette = {
     700: "#15803d",
     800: "#166534",
     900: "#14532d"
+  },
+  amber: {
+    50: "#fffbeb",
+    100: "#fef3c7",
+    200: "#fde68a",
+    300: "#fcd34d",
+    400: "#fbbf24",
+    500: "#f59e0b",
+    600: "#d97706",
+    700: "#b45309",
+    800: "#92400e",
+    900: "#78350f"
   }
 };
 var space = {
@@ -139,6 +152,11 @@ var shadow = {
   md: "0 4px 12px rgba(0, 0, 0, 0.08)",
   lg: "0 12px 32px rgba(0, 0, 0, 0.12)"
 };
+var darkShadow = {
+  sm: "0 1px 2px rgba(0, 0, 0, 0.5)",
+  md: "0 0 0 1px rgba(255, 255, 255, 0.08), 0 4px 12px rgba(0, 0, 0, 0.5)",
+  lg: "0 0 0 1px rgba(255, 255, 255, 0.1), 0 12px 32px rgba(0, 0, 0, 0.6)"
+};
 var duration = {
   fast: "120ms",
   normal: "200ms",
@@ -192,6 +210,15 @@ var lightColors = {
     subtle: palette.green[50],
     subtleHover: palette.green[100],
     text: palette.green[700]
+  },
+  // 노란색은 밝아서 solid 위 글자는 흰색이 아닌 어두운 색이다
+  warning: {
+    solid: palette.amber[500],
+    solidHover: palette.amber[600],
+    contrast: palette.gray[900],
+    subtle: palette.amber[50],
+    subtleHover: palette.amber[100],
+    text: palette.amber[800]
   }
 };
 var darkColors = {
@@ -206,7 +233,8 @@ var darkColors = {
   border: { default: palette.gray[700], strong: palette.gray[500], focus: palette.blue[400] },
   primary: {
     solid: palette.blue[600],
-    solidHover: palette.blue[500],
+    solidHover: palette.blue[700],
+    // 흰 글자 대비 유지를 위해 다크에서도 hover 는 어둡게 (blue500 은 4.38)
     contrast: palette.white,
     subtle: "rgba(59, 111, 246, 0.16)",
     subtleHover: "rgba(59, 111, 246, 0.26)",
@@ -222,7 +250,7 @@ var darkColors = {
   },
   danger: {
     solid: palette.red[600],
-    solidHover: palette.red[500],
+    solidHover: palette.red[700],
     contrast: palette.white,
     subtle: "rgba(239, 68, 68, 0.16)",
     subtleHover: "rgba(239, 68, 68, 0.26)",
@@ -230,16 +258,25 @@ var darkColors = {
   },
   success: {
     solid: palette.green[700],
-    solidHover: palette.green[600],
+    solidHover: palette.green[800],
     contrast: palette.white,
     subtle: "rgba(34, 197, 94, 0.16)",
     subtleHover: "rgba(34, 197, 94, 0.26)",
     text: palette.green[300]
+  },
+  warning: {
+    solid: palette.amber[500],
+    solidHover: palette.amber[400],
+    contrast: palette.gray[900],
+    subtle: "rgba(245, 158, 11, 0.16)",
+    subtleHover: "rgba(245, 158, 11, 0.26)",
+    text: palette.amber[300]
   }
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   darkColors,
+  darkShadow,
   duration,
   fontFamily,
   fontSize,

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"sourcesContent":["/**\n * BestOW UI 디자인 토큰.\n * 플랫폼에 독립적인 원시 값만 정의한다. 컴포넌트는 @bestow-ui/react 의 테마(vars)를 통해 참조한다.\n */\n\nexport const palette = {\n  white: '#ffffff',\n  black: '#000000',\n  gray: {\n    50: '#f8f9fa',\n    100: '#f1f3f5',\n    200: '#e9ecef',\n    300: '#dee2e6',\n    400: '#ced4da',\n    500: '#adb5bd',\n    600: '#666e76', // 흰색·gray50·gray100 배경에서 4.5:1 이상 (fg.subtle 로 쓰인다)\n    700: '#495057',\n    800: '#343a40',\n    900: '#212529',\n    950: '#16181b',\n  },\n  blue: {\n    50: '#eef4ff',\n    100: '#dbe6fe',\n    200: '#bfd3fe',\n    300: '#93b4fd',\n    400: '#6090fa',\n    500: '#3b6ff6',\n    600: '#2554eb',\n    700: '#1d42d8',\n    800: '#1e37af',\n    900: '#1e338a',\n  },\n  red: {\n    50: '#fef2f2',\n    100: '#fee2e2',\n    200: '#fecaca',\n    300: '#fca5a5',\n    400: '#f87171',\n    500: '#ef4444',\n    600: '#dc2626',\n    700: '#b91c1c',\n    800: '#991b1b',\n    900: '#7f1d1d',\n  },\n  green: {\n    50: '#f0fdf4',\n    100: '#dcfce7',\n    200: '#bbf7d0',\n    300: '#86efac',\n    400: '#4ade80',\n    500: '#22c55e',\n    600: '#16a34a',\n    700: '#15803d',\n    800: '#166534',\n    900: '#14532d',\n  },\n} as const;\n\nexport const space = {\n  0: '0',\n  1: '4px',\n  2: '8px',\n  3: '12px',\n  4: '16px',\n  5: '20px',\n  6: '24px',\n  8: '32px',\n  10: '40px',\n  12: '48px',\n  16: '64px',\n} as const;\n\nexport const radius = {\n  none: '0',\n  sm: '4px',\n  md: '8px',\n  lg: '12px',\n  xl: '16px',\n  full: '9999px',\n} as const;\n\nexport const fontFamily = {\n  sans: '\"Pretendard Variable\", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, \"Apple SD Gothic Neo\", \"Noto Sans KR\", sans-serif',\n  mono: '\"JetBrains Mono\", ui-monospace, SFMono-Regular, Menlo, monospace',\n} as const;\n\nexport const fontSize = {\n  xs: '12px',\n  sm: '14px',\n  md: '16px',\n  lg: '18px',\n  xl: '20px',\n  '2xl': '24px',\n  '3xl': '30px',\n  '4xl': '36px',\n} as const;\n\nexport const fontWeight = {\n  regular: '400',\n  medium: '500',\n  semibold: '600',\n  bold: '700',\n} as const;\n\nexport const lineHeight = {\n  tight: '1.25',\n  normal: '1.5',\n  relaxed: '1.75',\n} as const;\n\nexport const shadow = {\n  sm: '0 1px 2px rgba(0, 0, 0, 0.06)',\n  md: '0 4px 12px rgba(0, 0, 0, 0.08)',\n  lg: '0 12px 32px rgba(0, 0, 0, 0.12)',\n} as const;\n\nexport const duration = {\n  fast: '120ms',\n  normal: '200ms',\n  slow: '320ms',\n} as const;\n\nexport const zIndex = {\n  dropdown: '1000',\n  overlay: '1300',\n  modal: '1310',\n  toast: '1400',\n  tooltip: '1500',\n} as const;\n\n/** 의미 기반(semantic) 색상. 라이트/다크 테마가 같은 키를 가져야 한다. */\n/** solid 배경 위 글자색은 각 그룹의 contrast 를 사용한다. */\nexport interface SemanticColors {\n  bg: { default: string; subtle: string; muted: string; inverse: string; overlay: string };\n  fg: { default: string; muted: string; subtle: string; inverse: string };\n  border: { default: string; strong: string; focus: string };\n  primary: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n  neutral: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n  danger: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n  success: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n}\n\nexport const lightColors: SemanticColors = {\n  bg: {\n    default: palette.white,\n    subtle: palette.gray[50],\n    muted: palette.gray[100],\n    inverse: palette.gray[900],\n    overlay: 'rgba(0, 0, 0, 0.45)',\n  },\n  fg: { default: palette.gray[900], muted: palette.gray[700], subtle: palette.gray[600], inverse: palette.white },\n  border: { default: palette.gray[300], strong: palette.gray[500], focus: palette.blue[500] },\n  primary: {\n    solid: palette.blue[600],\n    solidHover: palette.blue[700],\n    contrast: palette.white,\n    subtle: palette.blue[50],\n    subtleHover: palette.blue[100],\n    text: palette.blue[700],\n  },\n  neutral: {\n    solid: palette.gray[800],\n    solidHover: palette.gray[900],\n    contrast: palette.white,\n    subtle: palette.gray[100],\n    subtleHover: palette.gray[200],\n    text: palette.gray[800],\n  },\n  danger: {\n    solid: palette.red[600],\n    solidHover: palette.red[700],\n    contrast: palette.white,\n    subtle: palette.red[50],\n    subtleHover: palette.red[100],\n    text: palette.red[700],\n  },\n  success: {\n    solid: palette.green[700],\n    solidHover: palette.green[800],\n    contrast: palette.white,\n    subtle: palette.green[50],\n    subtleHover: palette.green[100],\n    text: palette.green[700],\n  },\n};\n\nexport const darkColors: SemanticColors = {\n  bg: {\n    default: palette.gray[950],\n    subtle: palette.gray[900],\n    muted: palette.gray[800],\n    inverse: palette.gray[50],\n    overlay: 'rgba(0, 0, 0, 0.65)',\n  },\n  fg: { default: palette.gray[50], muted: palette.gray[300], subtle: palette.gray[500], inverse: palette.gray[900] },\n  border: { default: palette.gray[700], strong: palette.gray[500], focus: palette.blue[400] },\n  primary: {\n    solid: palette.blue[600],\n    solidHover: palette.blue[500],\n    contrast: palette.white,\n    subtle: 'rgba(59, 111, 246, 0.16)',\n    subtleHover: 'rgba(59, 111, 246, 0.26)',\n    text: palette.blue[300],\n  },\n  neutral: {\n    solid: palette.gray[200],\n    solidHover: palette.gray[100],\n    contrast: palette.gray[900],\n    subtle: 'rgba(255, 255, 255, 0.08)',\n    subtleHover: 'rgba(255, 255, 255, 0.14)',\n    text: palette.gray[100],\n  },\n  danger: {\n    solid: palette.red[600],\n    solidHover: palette.red[500],\n    contrast: palette.white,\n    subtle: 'rgba(239, 68, 68, 0.16)',\n    subtleHover: 'rgba(239, 68, 68, 0.26)',\n    text: palette.red[300],\n  },\n  success: {\n    solid: palette.green[700],\n    solidHover: palette.green[600],\n    contrast: palette.white,\n    subtle: 'rgba(34, 197, 94, 0.16)',\n    subtleHover: 'rgba(34, 197, 94, 0.26)',\n    text: palette.green[300],\n  },\n};\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["/**\n * BestOW UI 디자인 토큰.\n * 플랫폼에 독립적인 원시 값만 정의한다. 컴포넌트는 @bestow-ui/react 의 테마(vars)를 통해 참조한다.\n */\n\nexport const palette = {\n  white: '#ffffff',\n  black: '#000000',\n  gray: {\n    50: '#f8f9fa',\n    100: '#f1f3f5',\n    200: '#e9ecef',\n    300: '#dee2e6',\n    400: '#ced4da',\n    500: '#adb5bd',\n    600: '#666e76', // 흰색·gray50·gray100 배경에서 4.5:1 이상 (fg.subtle 로 쓰인다)\n    700: '#495057',\n    800: '#343a40',\n    900: '#212529',\n    950: '#16181b',\n  },\n  blue: {\n    50: '#eef4ff',\n    100: '#dbe6fe',\n    200: '#bfd3fe',\n    300: '#93b4fd',\n    400: '#6090fa',\n    500: '#3b6ff6',\n    600: '#2554eb',\n    700: '#1d42d8',\n    800: '#1e37af',\n    900: '#1e338a',\n  },\n  red: {\n    50: '#fef2f2',\n    100: '#fee2e2',\n    200: '#fecaca',\n    300: '#fca5a5',\n    400: '#f87171',\n    500: '#ef4444',\n    600: '#dc2626',\n    700: '#b91c1c',\n    800: '#991b1b',\n    900: '#7f1d1d',\n  },\n  green: {\n    50: '#f0fdf4',\n    100: '#dcfce7',\n    200: '#bbf7d0',\n    300: '#86efac',\n    400: '#4ade80',\n    500: '#22c55e',\n    600: '#16a34a',\n    700: '#15803d',\n    800: '#166534',\n    900: '#14532d',\n  },\n  amber: {\n    50: '#fffbeb',\n    100: '#fef3c7',\n    200: '#fde68a',\n    300: '#fcd34d',\n    400: '#fbbf24',\n    500: '#f59e0b',\n    600: '#d97706',\n    700: '#b45309',\n    800: '#92400e',\n    900: '#78350f',\n  },\n} as const;\n\nexport const space = {\n  0: '0',\n  1: '4px',\n  2: '8px',\n  3: '12px',\n  4: '16px',\n  5: '20px',\n  6: '24px',\n  8: '32px',\n  10: '40px',\n  12: '48px',\n  16: '64px',\n} as const;\n\nexport const radius = {\n  none: '0',\n  sm: '4px',\n  md: '8px',\n  lg: '12px',\n  xl: '16px',\n  full: '9999px',\n} as const;\n\nexport const fontFamily = {\n  sans: '\"Pretendard Variable\", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, \"Apple SD Gothic Neo\", \"Noto Sans KR\", sans-serif',\n  mono: '\"JetBrains Mono\", ui-monospace, SFMono-Regular, Menlo, monospace',\n} as const;\n\nexport const fontSize = {\n  xs: '12px',\n  sm: '14px',\n  md: '16px',\n  lg: '18px',\n  xl: '20px',\n  '2xl': '24px',\n  '3xl': '30px',\n  '4xl': '36px',\n} as const;\n\nexport const fontWeight = {\n  regular: '400',\n  medium: '500',\n  semibold: '600',\n  bold: '700',\n} as const;\n\nexport const lineHeight = {\n  tight: '1.25',\n  normal: '1.5',\n  relaxed: '1.75',\n} as const;\n\n/** 라이트 모드 그림자. 다크 모드는 darkShadow 를 쓴다 (같은 키). */\nexport const shadow = {\n  sm: '0 1px 2px rgba(0, 0, 0, 0.06)',\n  md: '0 4px 12px rgba(0, 0, 0, 0.08)',\n  lg: '0 12px 32px rgba(0, 0, 0, 0.12)',\n} as const;\n\n/**\n * 다크 모드 그림자. 어두운 배경에서는 옅은 그림자가 보이지 않으므로 더 진하게 하고,\n * 떠 있는 면(md·lg)은 가장자리를 구분하는 옅은 밝은 테두리(ring)를 함께 둔다.\n */\nexport const darkShadow = {\n  sm: '0 1px 2px rgba(0, 0, 0, 0.5)',\n  md: '0 0 0 1px rgba(255, 255, 255, 0.08), 0 4px 12px rgba(0, 0, 0, 0.5)',\n  lg: '0 0 0 1px rgba(255, 255, 255, 0.1), 0 12px 32px rgba(0, 0, 0, 0.6)',\n} as const satisfies Record<keyof typeof shadow, string>;\n\nexport const duration = {\n  fast: '120ms',\n  normal: '200ms',\n  slow: '320ms',\n} as const;\n\nexport const zIndex = {\n  dropdown: '1000',\n  overlay: '1300',\n  modal: '1310',\n  toast: '1400',\n  tooltip: '1500',\n} as const;\n\n/** 의미 기반(semantic) 색상. 라이트/다크 테마가 같은 키를 가져야 한다. */\n/** solid 배경 위 글자색은 각 그룹의 contrast 를 사용한다. */\nexport interface SemanticColors {\n  bg: { default: string; subtle: string; muted: string; inverse: string; overlay: string };\n  fg: { default: string; muted: string; subtle: string; inverse: string };\n  border: { default: string; strong: string; focus: string };\n  primary: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n  neutral: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n  danger: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n  success: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n  warning: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n}\n\nexport const lightColors: SemanticColors = {\n  bg: {\n    default: palette.white,\n    subtle: palette.gray[50],\n    muted: palette.gray[100],\n    inverse: palette.gray[900],\n    overlay: 'rgba(0, 0, 0, 0.45)',\n  },\n  fg: { default: palette.gray[900], muted: palette.gray[700], subtle: palette.gray[600], inverse: palette.white },\n  border: { default: palette.gray[300], strong: palette.gray[500], focus: palette.blue[500] },\n  primary: {\n    solid: palette.blue[600],\n    solidHover: palette.blue[700],\n    contrast: palette.white,\n    subtle: palette.blue[50],\n    subtleHover: palette.blue[100],\n    text: palette.blue[700],\n  },\n  neutral: {\n    solid: palette.gray[800],\n    solidHover: palette.gray[900],\n    contrast: palette.white,\n    subtle: palette.gray[100],\n    subtleHover: palette.gray[200],\n    text: palette.gray[800],\n  },\n  danger: {\n    solid: palette.red[600],\n    solidHover: palette.red[700],\n    contrast: palette.white,\n    subtle: palette.red[50],\n    subtleHover: palette.red[100],\n    text: palette.red[700],\n  },\n  success: {\n    solid: palette.green[700],\n    solidHover: palette.green[800],\n    contrast: palette.white,\n    subtle: palette.green[50],\n    subtleHover: palette.green[100],\n    text: palette.green[700],\n  },\n  // 노란색은 밝아서 solid 위 글자는 흰색이 아닌 어두운 색이다\n  warning: {\n    solid: palette.amber[500],\n    solidHover: palette.amber[600],\n    contrast: palette.gray[900],\n    subtle: palette.amber[50],\n    subtleHover: palette.amber[100],\n    text: palette.amber[800],\n  },\n};\n\nexport const darkColors: SemanticColors = {\n  bg: {\n    default: palette.gray[950],\n    subtle: palette.gray[900],\n    muted: palette.gray[800],\n    inverse: palette.gray[50],\n    overlay: 'rgba(0, 0, 0, 0.65)',\n  },\n  fg: { default: palette.gray[50], muted: palette.gray[300], subtle: palette.gray[500], inverse: palette.gray[900] },\n  border: { default: palette.gray[700], strong: palette.gray[500], focus: palette.blue[400] },\n  primary: {\n    solid: palette.blue[600],\n    solidHover: palette.blue[700], // 흰 글자 대비 유지를 위해 다크에서도 hover 는 어둡게 (blue500 은 4.38)\n    contrast: palette.white,\n    subtle: 'rgba(59, 111, 246, 0.16)',\n    subtleHover: 'rgba(59, 111, 246, 0.26)',\n    text: palette.blue[300],\n  },\n  neutral: {\n    solid: palette.gray[200],\n    solidHover: palette.gray[100],\n    contrast: palette.gray[900],\n    subtle: 'rgba(255, 255, 255, 0.08)',\n    subtleHover: 'rgba(255, 255, 255, 0.14)',\n    text: palette.gray[100],\n  },\n  danger: {\n    solid: palette.red[600],\n    solidHover: palette.red[700],\n    contrast: palette.white,\n    subtle: 'rgba(239, 68, 68, 0.16)',\n    subtleHover: 'rgba(239, 68, 68, 0.26)',\n    text: palette.red[300],\n  },\n  success: {\n    solid: palette.green[700],\n    solidHover: palette.green[800],\n    contrast: palette.white,\n    subtle: 'rgba(34, 197, 94, 0.16)',\n    subtleHover: 'rgba(34, 197, 94, 0.26)',\n    text: palette.green[300],\n  },\n  warning: {\n    solid: palette.amber[500],\n    solidHover: palette.amber[400],\n    contrast: palette.gray[900],\n    subtle: 'rgba(245, 158, 11, 0.16)',\n    subtleHover: 'rgba(245, 158, 11, 0.26)',\n    text: palette.amber[300],\n  },\n};\n"],"mappings":"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","names":[]}

package/dist/index.d.cts

@@ -54,6 +54,18 @@ declare const palette: {
         readonly 800: "#166534";
         readonly 900: "#14532d";
     };
+    readonly amber: {
+        readonly 50: "#fffbeb";
+        readonly 100: "#fef3c7";
+        readonly 200: "#fde68a";
+        readonly 300: "#fcd34d";
+        readonly 400: "#fbbf24";
+        readonly 500: "#f59e0b";
+        readonly 600: "#d97706";
+        readonly 700: "#b45309";
+        readonly 800: "#92400e";
+        readonly 900: "#78350f";
+    };
 };
 declare const space: {
     readonly 0: "0";
@@ -101,11 +113,21 @@ declare const lineHeight: {
     readonly normal: "1.5";
     readonly relaxed: "1.75";
 };
+/** 라이트 모드 그림자. 다크 모드는 darkShadow 를 쓴다 (같은 키). */
 declare const shadow: {
     readonly sm: "0 1px 2px rgba(0, 0, 0, 0.06)";
     readonly md: "0 4px 12px rgba(0, 0, 0, 0.08)";
     readonly lg: "0 12px 32px rgba(0, 0, 0, 0.12)";
 };
+/**
+ * 다크 모드 그림자. 어두운 배경에서는 옅은 그림자가 보이지 않으므로 더 진하게 하고,
+ * 떠 있는 면(md·lg)은 가장자리를 구분하는 옅은 밝은 테두리(ring)를 함께 둔다.
+ */
+declare const darkShadow: {
+    readonly sm: "0 1px 2px rgba(0, 0, 0, 0.5)";
+    readonly md: "0 0 0 1px rgba(255, 255, 255, 0.08), 0 4px 12px rgba(0, 0, 0, 0.5)";
+    readonly lg: "0 0 0 1px rgba(255, 255, 255, 0.1), 0 12px 32px rgba(0, 0, 0, 0.6)";
+};
 declare const duration: {
     readonly fast: "120ms";
     readonly normal: "200ms";
@@ -171,8 +193,16 @@ interface SemanticColors {
         subtleHover: string;
         text: string;
     };
+    warning: {
+        solid: string;
+        solidHover: string;
+        contrast: string;
+        subtle: string;
+        subtleHover: string;
+        text: string;
+    };
 }
 declare const lightColors: SemanticColors;
 declare const darkColors: SemanticColors;
 
-export { type SemanticColors, darkColors, duration, fontFamily, fontSize, fontWeight, lightColors, lineHeight, palette, radius, shadow, space, zIndex };
+export { type SemanticColors, darkColors, darkShadow, duration, fontFamily, fontSize, fontWeight, lightColors, lineHeight, palette, radius, shadow, space, zIndex };

package/dist/index.d.ts

@@ -54,6 +54,18 @@ declare const palette: {
         readonly 800: "#166534";
         readonly 900: "#14532d";
     };
+    readonly amber: {
+        readonly 50: "#fffbeb";
+        readonly 100: "#fef3c7";
+        readonly 200: "#fde68a";
+        readonly 300: "#fcd34d";
+        readonly 400: "#fbbf24";
+        readonly 500: "#f59e0b";
+        readonly 600: "#d97706";
+        readonly 700: "#b45309";
+        readonly 800: "#92400e";
+        readonly 900: "#78350f";
+    };
 };
 declare const space: {
     readonly 0: "0";
@@ -101,11 +113,21 @@ declare const lineHeight: {
     readonly normal: "1.5";
     readonly relaxed: "1.75";
 };
+/** 라이트 모드 그림자. 다크 모드는 darkShadow 를 쓴다 (같은 키). */
 declare const shadow: {
     readonly sm: "0 1px 2px rgba(0, 0, 0, 0.06)";
     readonly md: "0 4px 12px rgba(0, 0, 0, 0.08)";
     readonly lg: "0 12px 32px rgba(0, 0, 0, 0.12)";
 };
+/**
+ * 다크 모드 그림자. 어두운 배경에서는 옅은 그림자가 보이지 않으므로 더 진하게 하고,
+ * 떠 있는 면(md·lg)은 가장자리를 구분하는 옅은 밝은 테두리(ring)를 함께 둔다.
+ */
+declare const darkShadow: {
+    readonly sm: "0 1px 2px rgba(0, 0, 0, 0.5)";
+    readonly md: "0 0 0 1px rgba(255, 255, 255, 0.08), 0 4px 12px rgba(0, 0, 0, 0.5)";
+    readonly lg: "0 0 0 1px rgba(255, 255, 255, 0.1), 0 12px 32px rgba(0, 0, 0, 0.6)";
+};
 declare const duration: {
     readonly fast: "120ms";
     readonly normal: "200ms";
@@ -171,8 +193,16 @@ interface SemanticColors {
         subtleHover: string;
         text: string;
     };
+    warning: {
+        solid: string;
+        solidHover: string;
+        contrast: string;
+        subtle: string;
+        subtleHover: string;
+        text: string;
+    };
 }
 declare const lightColors: SemanticColors;
 declare const darkColors: SemanticColors;
 
-export { type SemanticColors, darkColors, duration, fontFamily, fontSize, fontWeight, lightColors, lineHeight, palette, radius, shadow, space, zIndex };
+export { type SemanticColors, darkColors, darkShadow, duration, fontFamily, fontSize, fontWeight, lightColors, lineHeight, palette, radius, shadow, space, zIndex };

package/dist/index.js

@@ -51,6 +51,18 @@ var palette = {
     700: "#15803d",
     800: "#166534",
     900: "#14532d"
+  },
+  amber: {
+    50: "#fffbeb",
+    100: "#fef3c7",
+    200: "#fde68a",
+    300: "#fcd34d",
+    400: "#fbbf24",
+    500: "#f59e0b",
+    600: "#d97706",
+    700: "#b45309",
+    800: "#92400e",
+    900: "#78350f"
   }
 };
 var space = {
@@ -104,6 +116,11 @@ var shadow = {
   md: "0 4px 12px rgba(0, 0, 0, 0.08)",
   lg: "0 12px 32px rgba(0, 0, 0, 0.12)"
 };
+var darkShadow = {
+  sm: "0 1px 2px rgba(0, 0, 0, 0.5)",
+  md: "0 0 0 1px rgba(255, 255, 255, 0.08), 0 4px 12px rgba(0, 0, 0, 0.5)",
+  lg: "0 0 0 1px rgba(255, 255, 255, 0.1), 0 12px 32px rgba(0, 0, 0, 0.6)"
+};
 var duration = {
   fast: "120ms",
   normal: "200ms",
@@ -157,6 +174,15 @@ var lightColors = {
     subtle: palette.green[50],
     subtleHover: palette.green[100],
     text: palette.green[700]
+  },
+  // 노란색은 밝아서 solid 위 글자는 흰색이 아닌 어두운 색이다
+  warning: {
+    solid: palette.amber[500],
+    solidHover: palette.amber[600],
+    contrast: palette.gray[900],
+    subtle: palette.amber[50],
+    subtleHover: palette.amber[100],
+    text: palette.amber[800]
   }
 };
 var darkColors = {
@@ -171,7 +197,8 @@ var darkColors = {
   border: { default: palette.gray[700], strong: palette.gray[500], focus: palette.blue[400] },
   primary: {
     solid: palette.blue[600],
-    solidHover: palette.blue[500],
+    solidHover: palette.blue[700],
+    // 흰 글자 대비 유지를 위해 다크에서도 hover 는 어둡게 (blue500 은 4.38)
     contrast: palette.white,
     subtle: "rgba(59, 111, 246, 0.16)",
     subtleHover: "rgba(59, 111, 246, 0.26)",
@@ -187,7 +214,7 @@ var darkColors = {
   },
   danger: {
     solid: palette.red[600],
-    solidHover: palette.red[500],
+    solidHover: palette.red[700],
     contrast: palette.white,
     subtle: "rgba(239, 68, 68, 0.16)",
     subtleHover: "rgba(239, 68, 68, 0.26)",
@@ -195,15 +222,24 @@ var darkColors = {
   },
   success: {
     solid: palette.green[700],
-    solidHover: palette.green[600],
+    solidHover: palette.green[800],
     contrast: palette.white,
     subtle: "rgba(34, 197, 94, 0.16)",
     subtleHover: "rgba(34, 197, 94, 0.26)",
     text: palette.green[300]
+  },
+  warning: {
+    solid: palette.amber[500],
+    solidHover: palette.amber[400],
+    contrast: palette.gray[900],
+    subtle: "rgba(245, 158, 11, 0.16)",
+    subtleHover: "rgba(245, 158, 11, 0.26)",
+    text: palette.amber[300]
   }
 };
 export {
   darkColors,
+  darkShadow,
   duration,
   fontFamily,
   fontSize,

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"sourcesContent":["/**\n * BestOW UI 디자인 토큰.\n * 플랫폼에 독립적인 원시 값만 정의한다. 컴포넌트는 @bestow-ui/react 의 테마(vars)를 통해 참조한다.\n */\n\nexport const palette = {\n  white: '#ffffff',\n  black: '#000000',\n  gray: {\n    50: '#f8f9fa',\n    100: '#f1f3f5',\n    200: '#e9ecef',\n    300: '#dee2e6',\n    400: '#ced4da',\n    500: '#adb5bd',\n    600: '#666e76', // 흰색·gray50·gray100 배경에서 4.5:1 이상 (fg.subtle 로 쓰인다)\n    700: '#495057',\n    800: '#343a40',\n    900: '#212529',\n    950: '#16181b',\n  },\n  blue: {\n    50: '#eef4ff',\n    100: '#dbe6fe',\n    200: '#bfd3fe',\n    300: '#93b4fd',\n    400: '#6090fa',\n    500: '#3b6ff6',\n    600: '#2554eb',\n    700: '#1d42d8',\n    800: '#1e37af',\n    900: '#1e338a',\n  },\n  red: {\n    50: '#fef2f2',\n    100: '#fee2e2',\n    200: '#fecaca',\n    300: '#fca5a5',\n    400: '#f87171',\n    500: '#ef4444',\n    600: '#dc2626',\n    700: '#b91c1c',\n    800: '#991b1b',\n    900: '#7f1d1d',\n  },\n  green: {\n    50: '#f0fdf4',\n    100: '#dcfce7',\n    200: '#bbf7d0',\n    300: '#86efac',\n    400: '#4ade80',\n    500: '#22c55e',\n    600: '#16a34a',\n    700: '#15803d',\n    800: '#166534',\n    900: '#14532d',\n  },\n} as const;\n\nexport const space = {\n  0: '0',\n  1: '4px',\n  2: '8px',\n  3: '12px',\n  4: '16px',\n  5: '20px',\n  6: '24px',\n  8: '32px',\n  10: '40px',\n  12: '48px',\n  16: '64px',\n} as const;\n\nexport const radius = {\n  none: '0',\n  sm: '4px',\n  md: '8px',\n  lg: '12px',\n  xl: '16px',\n  full: '9999px',\n} as const;\n\nexport const fontFamily = {\n  sans: '\"Pretendard Variable\", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, \"Apple SD Gothic Neo\", \"Noto Sans KR\", sans-serif',\n  mono: '\"JetBrains Mono\", ui-monospace, SFMono-Regular, Menlo, monospace',\n} as const;\n\nexport const fontSize = {\n  xs: '12px',\n  sm: '14px',\n  md: '16px',\n  lg: '18px',\n  xl: '20px',\n  '2xl': '24px',\n  '3xl': '30px',\n  '4xl': '36px',\n} as const;\n\nexport const fontWeight = {\n  regular: '400',\n  medium: '500',\n  semibold: '600',\n  bold: '700',\n} as const;\n\nexport const lineHeight = {\n  tight: '1.25',\n  normal: '1.5',\n  relaxed: '1.75',\n} as const;\n\nexport const shadow = {\n  sm: '0 1px 2px rgba(0, 0, 0, 0.06)',\n  md: '0 4px 12px rgba(0, 0, 0, 0.08)',\n  lg: '0 12px 32px rgba(0, 0, 0, 0.12)',\n} as const;\n\nexport const duration = {\n  fast: '120ms',\n  normal: '200ms',\n  slow: '320ms',\n} as const;\n\nexport const zIndex = {\n  dropdown: '1000',\n  overlay: '1300',\n  modal: '1310',\n  toast: '1400',\n  tooltip: '1500',\n} as const;\n\n/** 의미 기반(semantic) 색상. 라이트/다크 테마가 같은 키를 가져야 한다. */\n/** solid 배경 위 글자색은 각 그룹의 contrast 를 사용한다. */\nexport interface SemanticColors {\n  bg: { default: string; subtle: string; muted: string; inverse: string; overlay: string };\n  fg: { default: string; muted: string; subtle: string; inverse: string };\n  border: { default: string; strong: string; focus: string };\n  primary: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n  neutral: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n  danger: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n  success: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n}\n\nexport const lightColors: SemanticColors = {\n  bg: {\n    default: palette.white,\n    subtle: palette.gray[50],\n    muted: palette.gray[100],\n    inverse: palette.gray[900],\n    overlay: 'rgba(0, 0, 0, 0.45)',\n  },\n  fg: { default: palette.gray[900], muted: palette.gray[700], subtle: palette.gray[600], inverse: palette.white },\n  border: { default: palette.gray[300], strong: palette.gray[500], focus: palette.blue[500] },\n  primary: {\n    solid: palette.blue[600],\n    solidHover: palette.blue[700],\n    contrast: palette.white,\n    subtle: palette.blue[50],\n    subtleHover: palette.blue[100],\n    text: palette.blue[700],\n  },\n  neutral: {\n    solid: palette.gray[800],\n    solidHover: palette.gray[900],\n    contrast: palette.white,\n    subtle: palette.gray[100],\n    subtleHover: palette.gray[200],\n    text: palette.gray[800],\n  },\n  danger: {\n    solid: palette.red[600],\n    solidHover: palette.red[700],\n    contrast: palette.white,\n    subtle: palette.red[50],\n    subtleHover: palette.red[100],\n    text: palette.red[700],\n  },\n  success: {\n    solid: palette.green[700],\n    solidHover: palette.green[800],\n    contrast: palette.white,\n    subtle: palette.green[50],\n    subtleHover: palette.green[100],\n    text: palette.green[700],\n  },\n};\n\nexport const darkColors: SemanticColors = {\n  bg: {\n    default: palette.gray[950],\n    subtle: palette.gray[900],\n    muted: palette.gray[800],\n    inverse: palette.gray[50],\n    overlay: 'rgba(0, 0, 0, 0.65)',\n  },\n  fg: { default: palette.gray[50], muted: palette.gray[300], subtle: palette.gray[500], inverse: palette.gray[900] },\n  border: { default: palette.gray[700], strong: palette.gray[500], focus: palette.blue[400] },\n  primary: {\n    solid: palette.blue[600],\n    solidHover: palette.blue[500],\n    contrast: palette.white,\n    subtle: 'rgba(59, 111, 246, 0.16)',\n    subtleHover: 'rgba(59, 111, 246, 0.26)',\n    text: palette.blue[300],\n  },\n  neutral: {\n    solid: palette.gray[200],\n    solidHover: palette.gray[100],\n    contrast: palette.gray[900],\n    subtle: 'rgba(255, 255, 255, 0.08)',\n    subtleHover: 'rgba(255, 255, 255, 0.14)',\n    text: palette.gray[100],\n  },\n  danger: {\n    solid: palette.red[600],\n    solidHover: palette.red[500],\n    contrast: palette.white,\n    subtle: 'rgba(239, 68, 68, 0.16)',\n    subtleHover: 'rgba(239, 68, 68, 0.26)',\n    text: palette.red[300],\n  },\n  success: {\n    solid: palette.green[700],\n    solidHover: palette.green[600],\n    contrast: palette.white,\n    subtle: 'rgba(34, 197, 94, 0.16)',\n    subtleHover: 'rgba(34, 197, 94, 0.26)',\n    text: palette.green[300],\n  },\n};\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["/**\n * BestOW UI 디자인 토큰.\n * 플랫폼에 독립적인 원시 값만 정의한다. 컴포넌트는 @bestow-ui/react 의 테마(vars)를 통해 참조한다.\n */\n\nexport const palette = {\n  white: '#ffffff',\n  black: '#000000',\n  gray: {\n    50: '#f8f9fa',\n    100: '#f1f3f5',\n    200: '#e9ecef',\n    300: '#dee2e6',\n    400: '#ced4da',\n    500: '#adb5bd',\n    600: '#666e76', // 흰색·gray50·gray100 배경에서 4.5:1 이상 (fg.subtle 로 쓰인다)\n    700: '#495057',\n    800: '#343a40',\n    900: '#212529',\n    950: '#16181b',\n  },\n  blue: {\n    50: '#eef4ff',\n    100: '#dbe6fe',\n    200: '#bfd3fe',\n    300: '#93b4fd',\n    400: '#6090fa',\n    500: '#3b6ff6',\n    600: '#2554eb',\n    700: '#1d42d8',\n    800: '#1e37af',\n    900: '#1e338a',\n  },\n  red: {\n    50: '#fef2f2',\n    100: '#fee2e2',\n    200: '#fecaca',\n    300: '#fca5a5',\n    400: '#f87171',\n    500: '#ef4444',\n    600: '#dc2626',\n    700: '#b91c1c',\n    800: '#991b1b',\n    900: '#7f1d1d',\n  },\n  green: {\n    50: '#f0fdf4',\n    100: '#dcfce7',\n    200: '#bbf7d0',\n    300: '#86efac',\n    400: '#4ade80',\n    500: '#22c55e',\n    600: '#16a34a',\n    700: '#15803d',\n    800: '#166534',\n    900: '#14532d',\n  },\n  amber: {\n    50: '#fffbeb',\n    100: '#fef3c7',\n    200: '#fde68a',\n    300: '#fcd34d',\n    400: '#fbbf24',\n    500: '#f59e0b',\n    600: '#d97706',\n    700: '#b45309',\n    800: '#92400e',\n    900: '#78350f',\n  },\n} as const;\n\nexport const space = {\n  0: '0',\n  1: '4px',\n  2: '8px',\n  3: '12px',\n  4: '16px',\n  5: '20px',\n  6: '24px',\n  8: '32px',\n  10: '40px',\n  12: '48px',\n  16: '64px',\n} as const;\n\nexport const radius = {\n  none: '0',\n  sm: '4px',\n  md: '8px',\n  lg: '12px',\n  xl: '16px',\n  full: '9999px',\n} as const;\n\nexport const fontFamily = {\n  sans: '\"Pretendard Variable\", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, \"Apple SD Gothic Neo\", \"Noto Sans KR\", sans-serif',\n  mono: '\"JetBrains Mono\", ui-monospace, SFMono-Regular, Menlo, monospace',\n} as const;\n\nexport const fontSize = {\n  xs: '12px',\n  sm: '14px',\n  md: '16px',\n  lg: '18px',\n  xl: '20px',\n  '2xl': '24px',\n  '3xl': '30px',\n  '4xl': '36px',\n} as const;\n\nexport const fontWeight = {\n  regular: '400',\n  medium: '500',\n  semibold: '600',\n  bold: '700',\n} as const;\n\nexport const lineHeight = {\n  tight: '1.25',\n  normal: '1.5',\n  relaxed: '1.75',\n} as const;\n\n/** 라이트 모드 그림자. 다크 모드는 darkShadow 를 쓴다 (같은 키). */\nexport const shadow = {\n  sm: '0 1px 2px rgba(0, 0, 0, 0.06)',\n  md: '0 4px 12px rgba(0, 0, 0, 0.08)',\n  lg: '0 12px 32px rgba(0, 0, 0, 0.12)',\n} as const;\n\n/**\n * 다크 모드 그림자. 어두운 배경에서는 옅은 그림자가 보이지 않으므로 더 진하게 하고,\n * 떠 있는 면(md·lg)은 가장자리를 구분하는 옅은 밝은 테두리(ring)를 함께 둔다.\n */\nexport const darkShadow = {\n  sm: '0 1px 2px rgba(0, 0, 0, 0.5)',\n  md: '0 0 0 1px rgba(255, 255, 255, 0.08), 0 4px 12px rgba(0, 0, 0, 0.5)',\n  lg: '0 0 0 1px rgba(255, 255, 255, 0.1), 0 12px 32px rgba(0, 0, 0, 0.6)',\n} as const satisfies Record<keyof typeof shadow, string>;\n\nexport const duration = {\n  fast: '120ms',\n  normal: '200ms',\n  slow: '320ms',\n} as const;\n\nexport const zIndex = {\n  dropdown: '1000',\n  overlay: '1300',\n  modal: '1310',\n  toast: '1400',\n  tooltip: '1500',\n} as const;\n\n/** 의미 기반(semantic) 색상. 라이트/다크 테마가 같은 키를 가져야 한다. */\n/** solid 배경 위 글자색은 각 그룹의 contrast 를 사용한다. */\nexport interface SemanticColors {\n  bg: { default: string; subtle: string; muted: string; inverse: string; overlay: string };\n  fg: { default: string; muted: string; subtle: string; inverse: string };\n  border: { default: string; strong: string; focus: string };\n  primary: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n  neutral: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n  danger: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n  success: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n  warning: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n}\n\nexport const lightColors: SemanticColors = {\n  bg: {\n    default: palette.white,\n    subtle: palette.gray[50],\n    muted: palette.gray[100],\n    inverse: palette.gray[900],\n    overlay: 'rgba(0, 0, 0, 0.45)',\n  },\n  fg: { default: palette.gray[900], muted: palette.gray[700], subtle: palette.gray[600], inverse: palette.white },\n  border: { default: palette.gray[300], strong: palette.gray[500], focus: palette.blue[500] },\n  primary: {\n    solid: palette.blue[600],\n    solidHover: palette.blue[700],\n    contrast: palette.white,\n    subtle: palette.blue[50],\n    subtleHover: palette.blue[100],\n    text: palette.blue[700],\n  },\n  neutral: {\n    solid: palette.gray[800],\n    solidHover: palette.gray[900],\n    contrast: palette.white,\n    subtle: palette.gray[100],\n    subtleHover: palette.gray[200],\n    text: palette.gray[800],\n  },\n  danger: {\n    solid: palette.red[600],\n    solidHover: palette.red[700],\n    contrast: palette.white,\n    subtle: palette.red[50],\n    subtleHover: palette.red[100],\n    text: palette.red[700],\n  },\n  success: {\n    solid: palette.green[700],\n    solidHover: palette.green[800],\n    contrast: palette.white,\n    subtle: palette.green[50],\n    subtleHover: palette.green[100],\n    text: palette.green[700],\n  },\n  // 노란색은 밝아서 solid 위 글자는 흰색이 아닌 어두운 색이다\n  warning: {\n    solid: palette.amber[500],\n    solidHover: palette.amber[600],\n    contrast: palette.gray[900],\n    subtle: palette.amber[50],\n    subtleHover: palette.amber[100],\n    text: palette.amber[800],\n  },\n};\n\nexport const darkColors: SemanticColors = {\n  bg: {\n    default: palette.gray[950],\n    subtle: palette.gray[900],\n    muted: palette.gray[800],\n    inverse: palette.gray[50],\n    overlay: 'rgba(0, 0, 0, 0.65)',\n  },\n  fg: { default: palette.gray[50], muted: palette.gray[300], subtle: palette.gray[500], inverse: palette.gray[900] },\n  border: { default: palette.gray[700], strong: palette.gray[500], focus: palette.blue[400] },\n  primary: {\n    solid: palette.blue[600],\n    solidHover: palette.blue[700], // 흰 글자 대비 유지를 위해 다크에서도 hover 는 어둡게 (blue500 은 4.38)\n    contrast: palette.white,\n    subtle: 'rgba(59, 111, 246, 0.16)',\n    subtleHover: 'rgba(59, 111, 246, 0.26)',\n    text: palette.blue[300],\n  },\n  neutral: {\n    solid: palette.gray[200],\n    solidHover: palette.gray[100],\n    contrast: palette.gray[900],\n    subtle: 'rgba(255, 255, 255, 0.08)',\n    subtleHover: 'rgba(255, 255, 255, 0.14)',\n    text: palette.gray[100],\n  },\n  danger: {\n    solid: palette.red[600],\n    solidHover: palette.red[700],\n    contrast: palette.white,\n    subtle: 'rgba(239, 68, 68, 0.16)',\n    subtleHover: 'rgba(239, 68, 68, 0.26)',\n    text: palette.red[300],\n  },\n  success: {\n    solid: palette.green[700],\n    solidHover: palette.green[800],\n    contrast: palette.white,\n    subtle: 'rgba(34, 197, 94, 0.16)',\n    subtleHover: 'rgba(34, 197, 94, 0.26)',\n    text: palette.green[300],\n  },\n  warning: {\n    solid: palette.amber[500],\n    solidHover: palette.amber[400],\n    contrast: palette.gray[900],\n    subtle: 'rgba(245, 158, 11, 0.16)',\n    subtleHover: 'rgba(245, 158, 11, 0.26)',\n    text: palette.amber[300],\n  },\n};\n"],"mappings":"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","names":[]}

package/package.json

@@ -1,14 +1,26 @@
 {
   "name": "@bestow-ui/tokens",
-  "version": "0.8.1",
-  "description": "BestOW UI design tokens",
+  "version": "0.9.0",
+  "description": "Design tokens for BestOW UI — colors, spacing, radius, typography, shadow, motion",
+  "keywords": [
+    "bestow-ui",
+    "design-system",
+    "design-tokens",
+    "tokens",
+    "colors",
+    "theme"
+  ],
   "license": "MIT",
+  "author": "Dev-BestOW",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/Dev-BestOW/BestOW-UI.git",
     "directory": "packages/tokens"
   },
   "homepage": "https://dev-bestow.github.io/BestOW-UI/",
+  "bugs": {
+    "url": "https://github.com/Dev-BestOW/BestOW-UI/issues"
+  },
   "publishConfig": {
     "access": "public"
   },