diff --git a/composeapp/src/main/java/com/example/composeapp/MainActivity.kt b/composeapp/src/main/java/com/example/composeapp/MainActivity.kt
index 7bc7011..0fe466f 100644
--- a/composeapp/src/main/java/com/example/composeapp/MainActivity.kt
+++ b/composeapp/src/main/java/com/example/composeapp/MainActivity.kt
@@ -7,12 +7,14 @@ import androidx.compose.runtime.Composable
 import androidx.navigation.compose.NavHost
 import androidx.navigation.compose.composable
 import androidx.navigation.compose.rememberNavController
-import com.example.composeapp.ui.datepicker.DatePickerScreen
 import com.example.composeapp.ui.AnimationScreen
 import com.example.composeapp.ui.ComponentScreen
+import com.example.composeapp.ui.DigitalAgencyScreen
 import com.example.composeapp.ui.PagerScreen
 import com.example.composeapp.ui.PlaygroundScreen
+import com.example.composeapp.ui.datepicker.DatePickerScreen
 import com.messi.designsystem.CustomTheme
+import com.messi.designsystem.digitalagency.DigitalAgencyTheme
 
 class MainActivity : AppCompatActivity() {
   override fun onCreate(savedInstanceState: Bundle?) {
@@ -34,5 +36,8 @@ fun CreateNav(startDestination: String = NavRouter.PlaygroundScreen) {
     composable(NavRouter.AnimationScreen) { AnimationScreen(navController) }
     composable(NavRouter.PagerScreen) { PagerScreen(navController) }
     composable(NavRouter.DatePickerScreen) { DatePickerScreen(navController) }
+    composable(NavRouter.DigitalAgencyScreen) {
+      DigitalAgencyTheme { DigitalAgencyScreen(navController) }
+    }
   }
 }
diff --git a/composeapp/src/main/java/com/example/composeapp/NavRouter.kt b/composeapp/src/main/java/com/example/composeapp/NavRouter.kt
index 2cd50ed..2627d8f 100644
--- a/composeapp/src/main/java/com/example/composeapp/NavRouter.kt
+++ b/composeapp/src/main/java/com/example/composeapp/NavRouter.kt
@@ -6,4 +6,5 @@ object NavRouter {
   const val PagerScreen = "PagerScreen"
   const val AnimationScreen = "AnimationScreen"
   const val DatePickerScreen = "DatePickerScreen"
+  const val DigitalAgencyScreen = "DigitalAgencyScreen"
 }
diff --git a/composeapp/src/main/java/com/example/composeapp/ui/DigitalAgencyScreen.kt b/composeapp/src/main/java/com/example/composeapp/ui/DigitalAgencyScreen.kt
new file mode 100644
index 0000000..a55061f
--- /dev/null
+++ b/composeapp/src/main/java/com/example/composeapp/ui/DigitalAgencyScreen.kt
@@ -0,0 +1,142 @@
+package com.example.composeapp.ui
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.border
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.BoxScope
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.aspectRatio
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.rememberLazyListState
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.Scaffold
+import androidx.compose.material3.Surface
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.rememberCoroutineScope
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.unit.dp
+import androidx.navigation.NavController
+import com.example.composeapp.R
+import com.messi.designsystem.digitalagency.DigitalAgencyTheme
+import com.messi.designsystem.digitalagency.component.ButtonSize
+import com.messi.designsystem.digitalagency.component.DigitalAgencyTopAppBar
+import com.messi.designsystem.digitalagency.component.PrimaryButton
+import com.messi.designsystem.digitalagency.component.ScrollTopButton
+import com.messi.designsystem.digitalagency.component.SecondaryButton
+import com.messi.designsystem.digitalagency.component.TertiaryButton
+import kotlinx.coroutines.launch
+
+@Composable
+fun DigitalAgencyScreen(navController: NavController) {
+  val listState = rememberLazyListState()
+  val coroutineScope = rememberCoroutineScope()
+  Scaffold(
+    topBar = {
+      DigitalAgencyTopAppBar(
+        textResId = R.string.compose_digital_agency,
+        navigationIcon = R.drawable.ic_arrow_back,
+        onClickNavigationIcon = navController::popBackStack
+      )
+    },
+    floatingActionButton = {
+      ScrollTopButton {
+        coroutineScope.launch {
+          listState.animateScrollToItem(index = 0)
+        }
+      }
+    }
+  ) {
+    Surface(
+      modifier = Modifier
+        .fillMaxSize()
+        .padding(it),
+      color = DigitalAgencyTheme.colors.backgroundPrimary
+    ) {
+      LazyColumn(
+        state = listState,
+        contentPadding = PaddingValues(vertical = 8.dp),
+        verticalArrangement = Arrangement.spacedBy(8.dp)
+      ) {
+        item {
+          ContentsCard(
+            modifier = Modifier.padding(horizontal = 16.dp),
+            description = "ボタン"
+          ) {
+            PrimaryButton(text = "ボタン", size = ButtonSize.Large) {}
+          }
+        }
+        item {
+          ContentsCard(
+            modifier = Modifier.padding(horizontal = 16.dp),
+            description = "ボタン"
+          ) {
+            PrimaryButton(text = "ボタン", size = ButtonSize.Large) {}
+          }
+        }
+        item {
+          PrimaryButton(text = "ラベル", size = ButtonSize.Large) {}
+          Spacer(modifier = Modifier.height(48.dp))
+          PrimaryButton(text = "ラベル", size = ButtonSize.Medium) {}
+          Spacer(modifier = Modifier.height(148.dp))
+          PrimaryButton(text = "ラベル", size = ButtonSize.Small) {}
+          Spacer(modifier = Modifier.height(148.dp))
+          SecondaryButton(text = "ラベル", size = ButtonSize.Large) {}
+          Spacer(modifier = Modifier.height(48.dp))
+          SecondaryButton(text = "ラベル", size = ButtonSize.Medium) {}
+          Spacer(modifier = Modifier.height(48.dp))
+          SecondaryButton(text = "ラベル", size = ButtonSize.Small) {}
+          Spacer(modifier = Modifier.height(148.dp))
+          TertiaryButton(text = "ラベル", size = ButtonSize.Large) {}
+          Spacer(modifier = Modifier.height(48.dp))
+          TertiaryButton(text = "ラベル", size = ButtonSize.Medium) {}
+          Spacer(modifier = Modifier.height(48.dp))
+          TertiaryButton(text = "ラベル", size = ButtonSize.Small) {}
+        }
+      }
+    }
+  }
+}
+
+@Composable
+private fun ContentsCard(
+  modifier: Modifier = Modifier,
+  description: String,
+  content: @Composable (BoxScope) -> Unit
+) {
+  Column(
+    modifier = modifier
+      .clip(RoundedCornerShape(8.dp))
+      .clickable { }
+      .border(
+        width = 1.dp,
+        color = DigitalAgencyTheme.colors.borderDivider,
+        shape = RoundedCornerShape(8.dp)
+      )
+  ) {
+    Box(
+      modifier = Modifier
+        .fillMaxWidth()
+        .aspectRatio(16f / 9f)
+        .background(
+          DigitalAgencyTheme.colors.backgroundTertiary,
+          RoundedCornerShape(topStart = 8.dp, topEnd = 8.dp)
+        ),
+      contentAlignment = Alignment.Center,
+      content = content
+    )
+    Column(modifier = Modifier.padding(horizontal = 16.dp, vertical = 12.dp)) {
+      Text(text = description, color = DigitalAgencyTheme.colors.textBody)
+    }
+  }
+}
diff --git a/composeapp/src/main/java/com/example/composeapp/ui/PlaygroundScreen.kt b/composeapp/src/main/java/com/example/composeapp/ui/PlaygroundScreen.kt
index 02b85a2..fd0bd83 100644
--- a/composeapp/src/main/java/com/example/composeapp/ui/PlaygroundScreen.kt
+++ b/composeapp/src/main/java/com/example/composeapp/ui/PlaygroundScreen.kt
@@ -29,6 +29,9 @@ fun PlaygroundScreen(navController: NavController) {
         MessiElevatedButton(text = stringResource(id = R.string.compose_date_picker)) {
           navController.navigate(NavRouter.DatePickerScreen)
         }
+        MessiElevatedButton(text = stringResource(id = R.string.compose_digital_agency)) {
+          navController.navigate(NavRouter.DigitalAgencyScreen)
+        }
       }
     }
   }
diff --git a/composeapp/src/main/res/values-night/themes.xml b/composeapp/src/main/res/values-night/themes.xml
index d812c21..8f5f1e4 100644
--- a/composeapp/src/main/res/values-night/themes.xml
+++ b/composeapp/src/main/res/values-night/themes.xml
@@ -1,16 +1,4 @@
 <resources>
   <!-- Base application theme. -->
-  <style name="Theme.AndroidTechSample" parent="Theme.MaterialComponents.DayNight.NoActionBar">
-    <!-- Primary brand color. -->
-    <item name="colorPrimary">@color/purple_200</item>
-    <item name="colorPrimaryVariant">@color/purple_700</item>
-    <item name="colorOnPrimary">@color/black_100</item>
-    <!-- Secondary brand color. -->
-    <item name="colorSecondary">@color/teal_200</item>
-    <item name="colorSecondaryVariant">@color/teal_200</item>
-    <item name="colorOnSecondary">@color/black_100</item>
-    <!-- Status bar color. -->
-    <item name="android:statusBarColor">?attr/colorPrimaryVariant</item>
-    <!-- Customize your theme here. -->
-  </style>
+  <style name="Theme.AndroidTechSample" parent="Theme.MaterialComponents.DayNight.NoActionBar"/>
 </resources>
diff --git a/composeapp/src/main/res/values/themes.xml b/composeapp/src/main/res/values/themes.xml
index 7bb19c9..8f5f1e4 100644
--- a/composeapp/src/main/res/values/themes.xml
+++ b/composeapp/src/main/res/values/themes.xml
@@ -1,16 +1,4 @@
 <resources>
   <!-- Base application theme. -->
-  <style name="Theme.AndroidTechSample" parent="Theme.MaterialComponents.DayNight.NoActionBar">
-    <!-- Primary brand color. -->
-    <item name="colorPrimary">@color/purple_500</item>
-    <item name="colorPrimaryVariant">@color/purple_700</item>
-    <item name="colorOnPrimary">@color/white_100</item>
-    <!-- Secondary brand color. -->
-    <item name="colorSecondary">@color/teal_200</item>
-    <item name="colorSecondaryVariant">@color/teal_700</item>
-    <item name="colorOnSecondary">@color/black_100</item>
-    <!-- Status bar color. -->
-    <item name="android:statusBarColor">?attr/colorPrimaryVariant</item>
-    <!-- Customize your theme here. -->
-  </style>
+  <style name="Theme.AndroidTechSample" parent="Theme.MaterialComponents.DayNight.NoActionBar"/>
 </resources>
diff --git a/core/designsystem/src/main/java/com/messi/designsystem/digitalagency/DigitalAgencyColorPalette.kt b/core/designsystem/src/main/java/com/messi/designsystem/digitalagency/DigitalAgencyColorPalette.kt
new file mode 100644
index 0000000..9003c07
--- /dev/null
+++ b/core/designsystem/src/main/java/com/messi/designsystem/digitalagency/DigitalAgencyColorPalette.kt
@@ -0,0 +1,109 @@
+package com.messi.designsystem.digitalagency
+
+import androidx.compose.runtime.Immutable
+import androidx.compose.ui.graphics.Color
+
+@Immutable
+data class DigitalAgencyColorPalette(
+  val backgroundPrimary: Color,
+  val backgroundSecondary: Color,
+  val backgroundTertiary: Color,
+  val textBody: Color,
+  val textDescription: Color,
+  val textPlaceHolder: Color,
+  val textOnFill: Color,
+  val textLink: Color,
+  val textHover: Color,
+  val textActive: Color,
+  val textVisited: Color,
+  val textAlert: Color,
+  val textDisabled: Color,
+  val iconLabel: Color,
+  val iconActive: Color,
+  val iconAlert: Color,
+  val iconDisabled: Color,
+  val buttonNormal: Color,
+  val buttonHover: Color,
+  val buttonActive: Color,
+  val buttonDisabledBG: Color,
+  val borderField: Color,
+  val borderDivider: Color,
+  val borderFocused: Color,
+  val borderSelected: Color,
+  val borderAlert: Color,
+  val borderDisabled: Color,
+  val statusSuccess: Color,
+  val statusAlert: Color,
+  val statusWarning: Color,
+  val chartPrimary: Color,
+  val chartSecondary: Color
+)
+
+val lightDigitalAgencyColorPalette = DigitalAgencyColorPalette(
+  backgroundPrimary = DigitalAgencyPrimitiveColor.white,
+  backgroundSecondary = DigitalAgencyPrimitiveColor.Sumi100,
+  backgroundTertiary = DigitalAgencyPrimitiveColor.Sumi50,
+  textBody = DigitalAgencyPrimitiveColor.Sumi900,
+  textDescription = DigitalAgencyPrimitiveColor.Sumi700,
+  textPlaceHolder = DigitalAgencyPrimitiveColor.Sumi600,
+  textOnFill = DigitalAgencyPrimitiveColor.white,
+  textLink = DigitalAgencyPrimitiveColor.Sea800,
+  textHover = DigitalAgencyPrimitiveColor.Sea600,
+  textActive = DigitalAgencyPrimitiveColor.Sea900,
+  textVisited = DigitalAgencyPrimitiveColor.Sea900,
+  textAlert = DigitalAgencyPrimitiveColor.Sun800,
+  textDisabled = DigitalAgencyPrimitiveColor.Sumi500,
+  iconLabel = DigitalAgencyPrimitiveColor.Sumi900,
+  iconActive = DigitalAgencyPrimitiveColor.Sea800,
+  iconAlert = DigitalAgencyPrimitiveColor.Sun800,
+  iconDisabled = DigitalAgencyPrimitiveColor.Sumi500,
+  buttonNormal = DigitalAgencyPrimitiveColor.Sea800,
+  buttonHover = DigitalAgencyPrimitiveColor.Sea800.copy(alpha = 0.13f),
+  buttonActive = DigitalAgencyPrimitiveColor.Sea800.copy(alpha = 0.13f),
+  buttonDisabledBG = DigitalAgencyPrimitiveColor.Sumi500,
+  borderField = DigitalAgencyPrimitiveColor.Sumi900,
+  borderDivider = DigitalAgencyPrimitiveColor.Sumi300,
+  borderFocused = DigitalAgencyPrimitiveColor.Wood600,
+  borderSelected = DigitalAgencyPrimitiveColor.Sea800,
+  borderAlert = DigitalAgencyPrimitiveColor.Sun800,
+  borderDisabled = DigitalAgencyPrimitiveColor.Sumi300,
+  statusSuccess = DigitalAgencyPrimitiveColor.Forest600,
+  statusAlert = DigitalAgencyPrimitiveColor.Sun800,
+  statusWarning = DigitalAgencyPrimitiveColor.Wood800,
+  chartPrimary = DigitalAgencyPrimitiveColor.Sea800,
+  chartSecondary = DigitalAgencyPrimitiveColor.Sea400,
+)
+val darkDigitalAgencyColorPalette = DigitalAgencyColorPalette(
+  backgroundPrimary = DigitalAgencyPrimitiveColor.Sumi900,
+  backgroundSecondary = DigitalAgencyPrimitiveColor.Sumi700,
+  backgroundTertiary = DigitalAgencyPrimitiveColor.Sumi800,
+  textBody = DigitalAgencyPrimitiveColor.white,
+  textDescription = DigitalAgencyPrimitiveColor.Sumi400,
+  textPlaceHolder = DigitalAgencyPrimitiveColor.Sumi500,
+  textOnFill = DigitalAgencyPrimitiveColor.white,
+  textLink = DigitalAgencyPrimitiveColor.Sea300,
+  textHover = DigitalAgencyPrimitiveColor.Sea200,
+  textActive = DigitalAgencyPrimitiveColor.Sea200,
+  textVisited = DigitalAgencyPrimitiveColor.Sea200,
+  textAlert = DigitalAgencyPrimitiveColor.Sun500,
+  textDisabled = DigitalAgencyPrimitiveColor.Sumi600,
+  iconLabel = DigitalAgencyPrimitiveColor.white,
+  iconActive = DigitalAgencyPrimitiveColor.Sea300,
+  iconAlert = DigitalAgencyPrimitiveColor.Sun500,
+  iconDisabled = DigitalAgencyPrimitiveColor.Sumi600,
+  buttonNormal = DigitalAgencyPrimitiveColor.Sea300,
+  buttonHover = DigitalAgencyPrimitiveColor.Sea300.copy(alpha = 0.1f),
+  buttonActive = DigitalAgencyPrimitiveColor.Sea300.copy(alpha = 0.1f),
+  buttonDisabledBG = DigitalAgencyPrimitiveColor.Sumi500,
+  borderField = DigitalAgencyPrimitiveColor.white,
+  borderDivider = DigitalAgencyPrimitiveColor.Sumi700,
+  borderFocused = DigitalAgencyPrimitiveColor.Wood600,
+  borderSelected = DigitalAgencyPrimitiveColor.Sea300,
+  borderAlert = DigitalAgencyPrimitiveColor.Sun500,
+  borderDisabled = DigitalAgencyPrimitiveColor.Sumi300,
+  statusSuccess = DigitalAgencyPrimitiveColor.Forest600,
+  statusAlert = DigitalAgencyPrimitiveColor.Sun500,
+  statusWarning = DigitalAgencyPrimitiveColor.Wood500,
+  chartPrimary = DigitalAgencyPrimitiveColor.Sea100,
+  chartSecondary = DigitalAgencyPrimitiveColor.Sea300,
+)
diff --git a/core/designsystem/src/main/java/com/messi/designsystem/digitalagency/DigitalAgencyPrimitiveColor.kt b/core/designsystem/src/main/java/com/messi/designsystem/digitalagency/DigitalAgencyPrimitiveColor.kt
new file mode 100644
index 0000000..d3fc492
--- /dev/null
+++ b/core/designsystem/src/main/java/com/messi/designsystem/digitalagency/DigitalAgencyPrimitiveColor.kt
@@ -0,0 +1,77 @@
+package com.messi.designsystem.digitalagency
+
+import androidx.compose.ui.graphics.Color
+
+object DigitalAgencyPrimitiveColor {
+  internal val white = Color(0xFFFFFFFF)
+
+  internal val Sea1200 = Color(0xFF00004F)
+  internal val Sea1100 = Color(0xFF000060)
+  internal val Sea1000 = Color(0xFF000071)
+  internal val Sea900 = Color(0xFF000082)
+  internal val Sea800 = Color(0xFF0017C1)
+  internal val Sea700 = Color(0xFF0031D8)
+  internal val Sea600 = Color(0xFF1A3EE8)
+  internal val Sea500 = Color(0xFF264AF4)
+  internal val Sea400 = Color(0xFF4979F5)
+  internal val Sea300 = Color(0xFF7096F8)
+  internal val Sea200 = Color(0xFF9DB7F9)
+  internal val Sea100 = Color(0xFFC5D7FB)
+  internal val Sea50 = Color(0xFFE8F1FE)
+
+  internal val Sumi1200 = Color(0xFF000000)
+  internal val Sumi1100 = Color(0xFF080808)
+  internal val Sumi1000 = Color(0xFF111111)
+  internal val Sumi900 = Color(0xFF1A1A1C)
+  internal val Sumi800 = Color(0xFF414143)
+  internal val Sumi700 = Color(0xFF626264)
+  internal val Sumi600 = Color(0xFF757578)
+  internal val Sumi500 = Color(0xFF949497)
+  internal val Sumi400 = Color(0xFFB4B4B7)
+  internal val Sumi300 = Color(0xFFD8D8DB)
+  internal val Sumi200 = Color(0xFFE8E8EB)
+  internal val Sumi100 = Color(0xFFF1F1F4)
+  internal val Sumi50 = Color(0xFFF8F8FB)
+
+  internal val Forest1200 = Color(0xFF032213)
+  internal val Forest1100 = Color(0xFF08351F)
+  internal val Forest1000 = Color(0xFF0C472A)
+  internal val Forest900 = Color(0xFF115A36)
+  internal val Forest800 = Color(0xFF197A4B)
+  internal val Forest700 = Color(0xFF1D8B56)
+  internal val Forest600 = Color(0xFF259D63)
+  internal val Forest500 = Color(0xFF2CAC6E)
+  internal val Forest400 = Color(0xFF51B883)
+  internal val Forest300 = Color(0xFF71C598)
+  internal val Forest200 = Color(0xFF9BD4B5)
+  internal val Forest100 = Color(0xFFC2E5D1)
+  internal val Forest50 = Color(0xFFE6F5EC)
+
+  internal val Wood1200 = Color(0xFF662E00)
+  internal val Wood1100 = Color(0xFF833B00)
+  internal val Wood1000 = Color(0xFF9C4600)
+  internal val Wood900 = Color(0xFFB65200)
+  internal val Wood800 = Color(0xFFC16800)
+  internal val Wood700 = Color(0xFFC87504)
+  internal val Wood600 = Color(0xFFCD820A)
+  internal val Wood500 = Color(0xFFD18D0F)
+  internal val Wood400 = Color(0xFFD69C2B)
+  internal val Wood300 = Color(0xFFDCAC4D)
+  internal val Wood200 = Color(0xFFE1C383)
+  internal val Wood100 = Color(0xFFE7D8B9)
+  internal val Wood50 = Color(0xFFF3EEE5)
+
+  internal val Sun1200 = Color(0xFF640101)
+  internal val Sun1100 = Color(0xFF890101)
+  internal val Sun1000 = Color(0xFFAF0000)
+  internal val Sun900 = Color(0xFFD50000)
+  internal val Sun800 = Color(0xFFEC0000)
+  internal val Sun700 = Color(0xFFFA1606)
+  internal val Sun600 = Color(0xFFFF220D)
+  internal val Sun500 = Color(0xFFFF4B36)
+  internal val Sun400 = Color(0xFFFF5838)
+  internal val Sun300 = Color(0xFFFF7B5C)
+  internal val Sun200 = Color(0xFFFFA28B)
+  internal val Sun100 = Color(0xFFFFC8B8)
+  internal val Sun50 = Color(0xFFFFE7E6)
+}
diff --git a/core/designsystem/src/main/java/com/messi/designsystem/digitalagency/DigitalAgencyTextStyle.kt b/core/designsystem/src/main/java/com/messi/designsystem/digitalagency/DigitalAgencyTextStyle.kt
new file mode 100644
index 0000000..5491721
--- /dev/null
+++ b/core/designsystem/src/main/java/com/messi/designsystem/digitalagency/DigitalAgencyTextStyle.kt
@@ -0,0 +1,80 @@
+package com.messi.designsystem.digitalagency
+
+import androidx.compose.ui.text.TextStyle
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.unit.sp
+
+object DigitalAgencyTextStyle {
+  val HeadL = TextStyle(
+    fontSize = 32.sp,
+    lineHeight = 48.sp,
+    fontWeight = FontWeight(500),
+    letterSpacing = 1.28.sp,
+  )
+  val HeadM = TextStyle(
+    fontSize = 28.sp,
+    lineHeight = 42.sp,
+    fontWeight = FontWeight(500),
+    letterSpacing = 1.12.sp,
+  )
+  val HeadS = TextStyle(
+    fontSize = 24.sp,
+    lineHeight = 36.sp,
+    fontWeight = FontWeight(500),
+    letterSpacing = 0.96.sp,
+  )
+  val HeadSS = TextStyle(
+    fontSize = 20.sp,
+    lineHeight = 30.sp,
+    fontWeight = FontWeight(500),
+    letterSpacing = 0.8.sp,
+  )
+  val HeadSSS = TextStyle(
+    fontSize = 16.sp,
+    lineHeight = 24.sp,
+    fontWeight = FontWeight(500),
+    letterSpacing = 0.64.sp,
+  )
+  val BodyL = TextStyle(
+    fontSize = 16.sp,
+    lineHeight = 28.sp,
+    fontWeight = FontWeight(400),
+    letterSpacing = 0.64.sp,
+  )
+  val BodyM = TextStyle(
+    fontSize = 14.sp,
+    lineHeight = 24.5.sp,
+    fontWeight = FontWeight(400),
+    letterSpacing = 0.56.sp,
+  )
+  val LabelL = TextStyle(
+    fontSize = 14.sp,
+    lineHeight = 24.5.sp,
+    fontWeight = FontWeight(500),
+    letterSpacing = 0.56.sp,
+  )
+  val LabelM = TextStyle(
+    fontSize = 12.sp,
+    lineHeight = 18.sp,
+    fontWeight = FontWeight(500),
+    letterSpacing = 0.15.sp,
+  )
+  val SupplementL = TextStyle(
+    fontSize = 12.sp,
+    lineHeight = 21.sp,
+    fontWeight = FontWeight(400),
+    letterSpacing = 0.15.sp,
+  )
+  val SupplementM = TextStyle(
+    fontSize = 10.sp,
+    lineHeight = 15.sp,
+    fontWeight = FontWeight(400),
+    letterSpacing = 0.15.sp,
+  )
+  val Button = TextStyle(
+    fontSize = 16.sp,
+    lineHeight = 24.sp,
+    fontWeight = FontWeight(700),
+    letterSpacing = 0.64.sp,
+  )
+}
diff --git a/core/designsystem/src/main/java/com/messi/designsystem/digitalagency/DigitalAgencyTheme.kt b/core/designsystem/src/main/java/com/messi/designsystem/digitalagency/DigitalAgencyTheme.kt
new file mode 100644
index 0000000..b7c9476
--- /dev/null
+++ b/core/designsystem/src/main/java/com/messi/designsystem/digitalagency/DigitalAgencyTheme.kt
@@ -0,0 +1,30 @@
+package com.messi.designsystem.digitalagency
+
+import androidx.compose.foundation.isSystemInDarkTheme
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.CompositionLocalProvider
+import androidx.compose.runtime.ReadOnlyComposable
+import androidx.compose.runtime.compositionLocalOf
+
+@Composable
+fun DigitalAgencyTheme(
+  darkTheme: Boolean = isSystemInDarkTheme(),
+  content: @Composable () -> Unit
+) {
+  val colorScheme = if (darkTheme) darkDigitalAgencyColorPalette else lightDigitalAgencyColorPalette
+  CompositionLocalProvider(
+    LocalDigitalAgencyColorPalette provides colorScheme,
+    content = content
+  )
+}
+
+private val LocalDigitalAgencyColorPalette = compositionLocalOf<DigitalAgencyColorPalette> {
+  error("No DigitalAgencyColorPalette provided")
+}
+
+object DigitalAgencyTheme {
+  val colors: DigitalAgencyColorPalette
+    @Composable
+    @ReadOnlyComposable
+    get() = LocalDigitalAgencyColorPalette.current
+}
diff --git a/core/designsystem/src/main/java/com/messi/designsystem/digitalagency/component/DigitalAgencyButtons.kt b/core/designsystem/src/main/java/com/messi/designsystem/digitalagency/component/DigitalAgencyButtons.kt
new file mode 100644
index 0000000..634feb9
--- /dev/null
+++ b/core/designsystem/src/main/java/com/messi/designsystem/digitalagency/component/DigitalAgencyButtons.kt
@@ -0,0 +1,140 @@
+package com.messi.designsystem.digitalagency.component
+
+import androidx.compose.foundation.BorderStroke
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.widthIn
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.Button
+import androidx.compose.material3.ButtonDefaults
+import androidx.compose.material3.OutlinedButton
+import androidx.compose.material3.Text
+import androidx.compose.material3.TextButton
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.text.style.TextDecoration
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.Dp
+import androidx.compose.ui.unit.dp
+import com.messi.designsystem.digitalagency.DigitalAgencyTextStyle
+import com.messi.designsystem.digitalagency.DigitalAgencyTheme
+
+enum class ButtonSize(val minWidth: Dp, val height: Dp) {
+  Large(minWidth = 136.dp, height = 56.dp),
+  Medium(minWidth = 96.dp, height = 48.dp),
+  Small(minWidth = 80.dp, height = 36.dp),
+}
+
+@Composable
+fun PrimaryButton(
+  text: String,
+  size: ButtonSize,
+  modifier: Modifier = Modifier,
+  enabled: Boolean = true,
+  onClick: () -> Unit,
+) {
+  Button(
+    colors = ButtonDefaults.buttonColors(
+      containerColor = DigitalAgencyTheme.colors.buttonNormal,
+      disabledContainerColor = DigitalAgencyTheme.colors.buttonDisabledBG
+    ),
+    onClick = onClick,
+    shape = RoundedCornerShape(8.dp),
+    modifier = modifier
+      .widthIn(min = size.minWidth)
+      .height(size.height),
+    enabled = enabled
+  ) {
+    Text(
+      text = text,
+      style = DigitalAgencyTextStyle.Button,
+      color = DigitalAgencyTheme.colors.textOnFill
+    )
+  }
+}
+
+@Composable
+fun SecondaryButton(
+  text: String,
+  size: ButtonSize,
+  modifier: Modifier = Modifier,
+  enabled: Boolean = true,
+  onClick: () -> Unit,
+) {
+  OutlinedButton(
+    onClick = onClick,
+    colors = ButtonDefaults.outlinedButtonColors(
+      contentColor = DigitalAgencyTheme.colors.buttonNormal,
+      disabledContentColor = DigitalAgencyTheme.colors.textDisabled,
+    ),
+    border = BorderStroke(
+      width = 1.dp,
+      color = if (enabled) DigitalAgencyTheme.colors.buttonNormal else DigitalAgencyTheme.colors.buttonDisabledBG
+    ),
+    shape = RoundedCornerShape(8.dp),
+    modifier = modifier
+      .widthIn(min = size.minWidth)
+      .height(size.height)
+      .background(DigitalAgencyTheme.colors.backgroundPrimary, RoundedCornerShape(8.dp)),
+    enabled = enabled
+  ) {
+    Text(
+      text = text,
+      style = DigitalAgencyTextStyle.Button,
+      color = if (enabled) DigitalAgencyTheme.colors.buttonNormal else DigitalAgencyTheme.colors.textDisabled
+    )
+  }
+}
+
+@Composable
+fun TertiaryButton(
+  text: String,
+  size: ButtonSize,
+  modifier: Modifier = Modifier,
+  enabled: Boolean = true,
+  onClick: () -> Unit,
+) {
+  TextButton(
+    onClick = onClick,
+    colors = ButtonDefaults.textButtonColors(
+      contentColor = DigitalAgencyTheme.colors.buttonNormal,
+      disabledContentColor = DigitalAgencyTheme.colors.textDisabled,
+    ),
+    shape = RoundedCornerShape(8.dp),
+    modifier = modifier
+      .widthIn(min = size.minWidth)
+      .height(size.height),
+    enabled = enabled
+  ) {
+    Text(
+      text = text,
+      style = DigitalAgencyTextStyle.Button.copy(
+        textDecoration = TextDecoration.Underline
+      ),
+    )
+  }
+}
+
+@Preview
+@Composable
+private fun PrimaryButtonPreview() {
+  DigitalAgencyTheme {
+    PrimaryButton(text = "ラベル", size = ButtonSize.Large) {}
+  }
+}
+
+@Preview
+@Composable
+private fun SecondaryButtonPreview() {
+  DigitalAgencyTheme {
+    SecondaryButton(text = "ラベル", size = ButtonSize.Large) {}
+  }
+}
+
+@Preview
+@Composable
+private fun TertiaryButtonPreview() {
+  DigitalAgencyTheme {
+    TertiaryButton(text = "ラベル", size = ButtonSize.Large) {}
+  }
+}
diff --git a/core/designsystem/src/main/java/com/messi/designsystem/digitalagency/component/DigitalAgencyIconButton.kt b/core/designsystem/src/main/java/com/messi/designsystem/digitalagency/component/DigitalAgencyIconButton.kt
new file mode 100644
index 0000000..d22186b
--- /dev/null
+++ b/core/designsystem/src/main/java/com/messi/designsystem/digitalagency/component/DigitalAgencyIconButton.kt
@@ -0,0 +1,30 @@
+package com.messi.designsystem.digitalagency.component
+
+import androidx.compose.foundation.border
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.material.Icon
+import androidx.compose.material.IconButton
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.unit.dp
+import com.messi.designsystem.R
+import com.messi.designsystem.digitalagency.DigitalAgencyTheme
+
+@Composable
+fun ScrollTopButton(modifier: Modifier = Modifier, enabled: Boolean = true, onClick: () -> Unit) {
+  IconButton(
+    modifier = modifier
+      .size(56.dp)
+      .border(width = 1.dp, color = DigitalAgencyTheme.colors.iconActive, shape = CircleShape),
+    enabled = enabled,
+    onClick = onClick,
+  ) {
+    Icon(
+      painter = painterResource(id = R.drawable.ic_arrow_back),
+      contentDescription = null,
+      tint = DigitalAgencyTheme.colors.iconActive
+    )
+  }
+}
diff --git a/core/designsystem/src/main/java/com/messi/designsystem/digitalagency/component/DigitalAgencyTopAppbar.kt b/core/designsystem/src/main/java/com/messi/designsystem/digitalagency/component/DigitalAgencyTopAppbar.kt
new file mode 100644
index 0000000..9e35d95
--- /dev/null
+++ b/core/designsystem/src/main/java/com/messi/designsystem/digitalagency/component/DigitalAgencyTopAppbar.kt
@@ -0,0 +1,68 @@
+package com.messi.designsystem.digitalagency.component
+
+import androidx.annotation.DrawableRes
+import androidx.annotation.StringRes
+import androidx.compose.foundation.layout.RowScope
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.statusBarsPadding
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.material3.Text
+import androidx.compose.material3.TopAppBar
+import androidx.compose.material3.TopAppBarDefaults
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.unit.dp
+import com.messi.designsystem.digitalagency.DigitalAgencyTheme
+
+@Composable
+fun DigitalAgencyTopAppBar(
+  @StringRes textResId: Int,
+  contentDescription: String? = null,
+  @DrawableRes navigationIcon: Int? = null,
+  onClickNavigationIcon: () -> Unit = {},
+  actions: @Composable RowScope.() -> Unit = {},
+) {
+  DigitalAgencyTopAppBar(
+    title = {
+      Text(
+        text = stringResource(id = textResId),
+      )
+    },
+    navigationIcon = {
+      navigationIcon?.let {
+        IconButton(onClick = onClickNavigationIcon) {
+          Icon(
+            modifier = Modifier.size(24.dp),
+            painter = painterResource(id = navigationIcon),
+            contentDescription = contentDescription,
+            tint = DigitalAgencyTheme.colors.iconLabel
+          )
+        }
+      }
+    },
+    actions = actions,
+  )
+}
+
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+fun DigitalAgencyTopAppBar(
+  title: @Composable () -> Unit,
+  modifier: Modifier = Modifier,
+  navigationIcon: @Composable () -> Unit = {},
+  actions: @Composable RowScope.() -> Unit = {},
+) {
+  TopAppBar(
+    title = title,
+    modifier = modifier.statusBarsPadding(),
+    navigationIcon = navigationIcon,
+    actions = actions,
+    colors = TopAppBarDefaults.topAppBarColors(
+      containerColor = DigitalAgencyTheme.colors.backgroundPrimary
+    ),
+  )
+}
diff --git a/feature/resources/src/main/res/values/strings.xml b/feature/resources/src/main/res/values/strings.xml
index 26fdfbb..72b08d9 100644
--- a/feature/resources/src/main/res/values/strings.xml
+++ b/feature/resources/src/main/res/values/strings.xml
@@ -105,5 +105,6 @@
   <string name="compose_pager">Pager</string>
   <string name="compose_animation">Animation</string>
   <string name="compose_date_picker">DatePicker</string>
+  <string name="compose_digital_agency">DigitalAgencyScreen</string>
 
 </resources>