diff --git a/core/designsystem/src/main/java/com/suwiki/core/designsystem/component/chips/SuwikiColorChip.kt b/core/designsystem/src/main/java/com/suwiki/core/designsystem/component/chips/SuwikiColorChip.kt
new file mode 100644
index 000000000..5f6d9f7c4
--- /dev/null
+++ b/core/designsystem/src/main/java/com/suwiki/core/designsystem/component/chips/SuwikiColorChip.kt
@@ -0,0 +1,43 @@
+package com.suwiki.core.designsystem.component.chips
+
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.size
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.saveable.rememberSaveable
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import com.suwiki.core.designsystem.R
+
+@Composable
+fun SuwikiColorChip(
+  isChecked: Boolean,
+  onClick: () -> Unit = {},
+) {
+  Box(
+    modifier = Modifier.size(40.dp),
+  ) {
+    Image(
+      painter = painterResource(id = if (isChecked) R.drawable.ic_color_checked_chip else R.drawable.ic_color_chip),
+      contentDescription = "",
+      modifier = Modifier.clickable(onClick = onClick),
+    )
+  }
+}
+
+@Preview(showBackground = true, backgroundColor = 0xFFFFFF)
+@Composable
+fun SuwikiColorChipPreview() {
+  var isChecked by rememberSaveable { mutableStateOf(false) }
+
+  SuwikiColorChip(
+    isChecked = isChecked,
+    onClick = { isChecked = !isChecked },
+  )
+}
diff --git a/core/designsystem/src/main/java/com/suwiki/core/designsystem/component/chips/SuwikiContainedChip.kt b/core/designsystem/src/main/java/com/suwiki/core/designsystem/component/chips/SuwikiContainedChip.kt
new file mode 100644
index 000000000..c3d2a6f01
--- /dev/null
+++ b/core/designsystem/src/main/java/com/suwiki/core/designsystem/component/chips/SuwikiContainedChip.kt
@@ -0,0 +1,78 @@
+package com.suwiki.core.designsystem.component.chips
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+enum class SuwikiChipType {
+  ORANGE,
+  BLUE,
+  GREEN,
+}
+
+@Composable
+fun SuwikiContainedChip(
+  isChecked: Boolean,
+  onClick: () -> Unit = {},
+  type: SuwikiChipType,
+  text: String,
+) {
+  val (backgroundColor, contentColor) = if (isChecked) {
+    when (type) {
+      SuwikiChipType.ORANGE -> Color(0xFFFFF3EB) to Color(0xFFFD873B)
+      SuwikiChipType.BLUE -> Color(0xFFECEDFF) to Color(0xFF3D4EFB)
+      SuwikiChipType.GREEN -> Color(0xFFEAF8EC) to Color(0xFF2DB942)
+    }
+  } else {
+    Color(0xFFF6F6F6) to Color(0xFF959595)
+  }
+
+  Box(
+    modifier = Modifier
+      .clip(RoundedCornerShape(5.dp))
+      .background(color = backgroundColor)
+      .clickable(onClick = onClick)
+      .height(26.dp),
+  ) {
+    Box(
+      modifier = Modifier
+        .padding(vertical = 4.dp, horizontal = 6.dp)
+        .height(18.dp),
+    ) {
+      Text(
+        text = text,
+        color = contentColor,
+        fontSize = 12.sp,
+        modifier = Modifier.align(Alignment.Center),
+      )
+    }
+  }
+}
+
+@Preview(showBackground = true, backgroundColor = 0xFFFFFF)
+@Composable
+fun SuwikiContainedChipPreview() {
+  var isChecked by remember { mutableStateOf(false) }
+
+  SuwikiContainedChip(
+    isChecked = isChecked,
+    onClick = { isChecked = !isChecked },
+    type = SuwikiChipType.GREEN,
+    text = "label",
+  )
+}
diff --git a/core/designsystem/src/main/java/com/suwiki/core/designsystem/component/chips/SuwikiOutlinedChip.kt b/core/designsystem/src/main/java/com/suwiki/core/designsystem/component/chips/SuwikiOutlinedChip.kt
new file mode 100644
index 000000000..6c8682120
--- /dev/null
+++ b/core/designsystem/src/main/java/com/suwiki/core/designsystem/component/chips/SuwikiOutlinedChip.kt
@@ -0,0 +1,69 @@
+package com.suwiki.core.designsystem.component.chips
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.border
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+
+@Composable
+fun SuwikiOutlinedChip(
+  text: String,
+  isChecked: Boolean,
+  onClick: () -> Unit = {},
+) {
+  val (borderLineColor, contentColor) = if (isChecked) {
+    Color(0xFFDADADA) to Color(0xFF959595)
+  } else {
+    Color(0xFF346CFD) to Color(0xFF346CFD)
+  }
+
+  Box(
+    modifier = Modifier
+      .clip(RoundedCornerShape(5.dp))
+      .clickable(onClick = onClick)
+      .height(26.dp)
+      .background(color = Color(0xFFFFFFFF))
+      .border(width = 1.dp, color = borderLineColor, shape = RoundedCornerShape(5.dp)),
+  ) {
+    Box(
+      modifier = Modifier
+        .padding(vertical = 4.dp, horizontal = 6.dp)
+        .height(18.dp),
+    ) {
+      Text(
+        text = text,
+        color = contentColor,
+        fontSize = 12.sp,
+        modifier = Modifier.align(Alignment.Center),
+      )
+    }
+  }
+}
+
+@Preview(showBackground = true, backgroundColor = 0xFFFFFF)
+@Composable
+fun SuwikiOutlinedChipPreview() {
+  var isChecked by remember { mutableStateOf(false) }
+
+  SuwikiOutlinedChip(
+    text = "label",
+    isChecked = isChecked,
+    onClick = { isChecked = !isChecked },
+  )
+}
diff --git a/core/designsystem/src/main/res/drawable/ic_color_checked_chip.xml b/core/designsystem/src/main/res/drawable/ic_color_checked_chip.xml
new file mode 100644
index 000000000..737680e91
--- /dev/null
+++ b/core/designsystem/src/main/res/drawable/ic_color_checked_chip.xml
@@ -0,0 +1,13 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="40dp"
+    android:height="40dp"
+    android:viewportWidth="40"
+    android:viewportHeight="40">
+  <path
+      android:pathData="M20,0L20,0A20,20 0,0 1,40 20L40,20A20,20 0,0 1,20 40L20,40A20,20 0,0 1,0 20L0,20A20,20 0,0 1,20 0z"
+      android:fillColor="#346CFD"/>
+  <path
+      android:pathData="M26.643,14.234C27.066,14.59 27.121,15.22 26.766,15.643L18.366,25.643C18.18,25.865 17.906,25.995 17.617,26C17.328,26.005 17.05,25.884 16.857,25.669L13.257,21.669C12.887,21.258 12.92,20.626 13.331,20.257C13.742,19.887 14.374,19.92 14.743,20.331L17.574,23.476L25.234,14.357C25.59,13.934 26.22,13.879 26.643,14.234Z"
+      android:fillColor="#ffffff"
+      android:fillType="evenOdd"/>
+</vector>
diff --git a/core/designsystem/src/main/res/drawable/ic_color_chip.xml b/core/designsystem/src/main/res/drawable/ic_color_chip.xml
new file mode 100644
index 000000000..8cf023874
--- /dev/null
+++ b/core/designsystem/src/main/res/drawable/ic_color_chip.xml
@@ -0,0 +1,9 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="40dp"
+    android:height="40dp"
+    android:viewportWidth="40"
+    android:viewportHeight="40">
+  <path
+      android:pathData="M20,0L20,0A20,20 0,0 1,40 20L40,20A20,20 0,0 1,20 40L20,40A20,20 0,0 1,0 20L0,20A20,20 0,0 1,20 0z"
+      android:fillColor="#346CFD"/>
+</vector>
diff --git a/presentation/src/main/res/values/strings.xml b/presentation/src/main/res/values/strings.xml
index 2ca737562..0de1544ac 100644
--- a/presentation/src/main/res/values/strings.xml
+++ b/presentation/src/main/res/values/strings.xml
@@ -1,3 +1,3 @@
 <resources>
     <string name="title_activity_main">MainActivity</string>
-</resources>
\ No newline at end of file
+</resources>