feat(colors): alpha 컬러 추가 (#10)

* feat: alpha 컬러 추가 * feat: 2.2.0 version update
sopt-makers · Oct 22, 2023 · bf4a7d2 · bf4a7d2
1 parent 42efaa4
commit bf4a7d2
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 1 deletion.
diff --git a/packages/colors/CHANGELOG.md b/packages/colors/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @sopt-makers/colors
 
+## 2.2.0
+
+### Minor Changes
+
+- feat: alpha color(opacity) 추가, white 빠진것 추가
+
 ## 2.1.0
 
 ### Minor Changes

diff --git a/packages/colors/package.json b/packages/colors/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@sopt-makers/colors",
-    "version": "2.1.0",
+    "version": "2.2.0",
     "description": "sopt-makers의 frontend repository에 사용되는 colors를 제공해요.",
     "license": "MIT",
     "main": "./dist/index.js",

diff --git a/packages/colors/src/colors.ts b/packages/colors/src/colors.ts
@@ -1,4 +1,5 @@
 export const colors = {
+  white: "#FFFFFF",
   gray10: "#FCFCFC",
   gray30: "#F0F0F0",
   gray50: "#E4E4E5",
@@ -75,4 +76,15 @@ export const colors = {
   secondary: "#F77234",
   success: "#346FFA",
   information: "#16BF81",
+
+  // opacity가 포함된 alpha 색상
+  grayAlpha100: "rgba(15, 15, 18, 0.8)",
+  grayAlpha200: "rgba(15, 15, 18, 0.5)",
+  grayAlpha300: "rgba(15, 15, 18, 0.2)",
+  blueAlpha100: "rgba(52, 111, 250, 0.6)",
+  blueAlpha200: "rgba(52, 111, 250, 0.3)",
+  blueAlpha300: "rgba(52, 111, 250, 0.1)",
+  redAlpha100: "rgba(240, 66, 81, 0.6)",
+  redAlpha200: "rgba(240, 66, 81, 0.3)",
+  redAlpha300: "rgba(240, 66, 81, 0.1)",
 };