feat(ui/react/styles/utilities): 전역적으로 사용되는 색상들을 담은 color 추가

packages/ui/react/src/styles/utilities/color.css.ts

@@ -0,0 +1,43 @@
+import { styleVariants } from '@vanilla-extract/css';
+import { vars } from '../vars.css';
+
+export const color = styleVariants({
+  archiveBlack: { color: vars.color.archive.black },
+  archiveBlue: { color: vars.color.archive.blue },
+  archiveBrightGreen: { color: vars.color.archive.brightGreen },
+  archiveCoral: { color: vars.color.archive.coral },
+  archiveMint: { color: vars.color.archive.mint },
+  archivePink: { color: vars.color.archive.pink },
+  archivePurple: { color: vars.color.archive.purple },
+  archiveYellow: { color: vars.color.archive.yellow },
+  gray100: { color: vars.color.gray[100] },
+  gray200: { color: vars.color.gray[200] },
+  gray300: { color: vars.color.gray[300] },
+  gray400: { color: vars.color.gray[400] },
+  gray500: { color: vars.color.gray[500] },
+  gray600: { color: vars.color.gray[600] },
+  gray700: { color: vars.color.gray[700] },
+  gray800: { color: vars.color.gray[800] },
+  gray900: { color: vars.color.gray[900] },
+  gray1000: { color: vars.color.gray[1000] },
+  gray1100: { color: vars.color.gray[1100] },
+  system100: { color: vars.color.system[100] },
+  system200: { color: vars.color.system[200] },
+  system300: { color: vars.color.system[300] },
+  repoTextBlack: { color: vars.color.repo.text.black },
+  repoTextBlue: { color: vars.color.repo.text.blue },
+  repoTextBrightGreen: { color: vars.color.repo.text.brightGreen },
+  repoTextCoral: { color: vars.color.repo.text.coral },
+  repoTextMint: { color: vars.color.repo.text.mint },
+  repoTextPink: { color: vars.color.repo.text.pink },
+  repoTextPurple: { color: vars.color.repo.text.purple },
+  repoTextYellow: { color: vars.color.repo.text.yellow },
+  repoBgBlack: { color: vars.color.repo.bg.black },
+  repoBgBlue: { color: vars.color.repo.bg.blue },
+  repoBgBrightGreen: { color: vars.color.repo.bg.brightGreen },
+  repoBgCoral: { color: vars.color.repo.bg.coral },
+  repoBgMint: { color: vars.color.repo.bg.mint },
+  repoBgPink: { color: vars.color.repo.bg.pink },
+  repoBgPurple: { color: vars.color.repo.bg.purple },
+  repoBgYellow: { color: vars.color.repo.bg.yellow },
+});