diff --git a/Gemfile b/Gemfile
index dac5d6e83..050bd30c5 100644
--- a/Gemfile
+++ b/Gemfile
@@ -2,6 +2,7 @@ source "https://rubygems.org"
 
 ruby '3.2.2'
 
+gem 'cocoapods', '~> 1.14.3'
 gem "fastlane"
 
 plugins_path = File.join(File.dirname(__FILE__), 'fastlane', 'Pluginfile')
diff --git a/Gemfile.lock b/Gemfile.lock
index b6b67b41d..8653524f1 100644
--- a/Gemfile.lock
+++ b/Gemfile.lock
@@ -3,8 +3,21 @@ GEM
   specs:
     CFPropertyList (3.0.6)
       rexml
+    activesupport (7.1.3)
+      base64
+      bigdecimal
+      concurrent-ruby (~> 1.0, >= 1.0.2)
+      connection_pool (>= 2.2.5)
+      drb
+      i18n (>= 1.6, < 2)
+      minitest (>= 5.1)
+      mutex_m
+      tzinfo (~> 2.0)
     addressable (2.8.5)
       public_suffix (>= 2.0.2, < 6.0)
+    algoliasearch (1.27.5)
+      httpclient (~> 2.8, >= 2.8.3)
+      json (>= 1.5.1)
     artifactory (3.0.15)
     atomos (0.1.3)
     aws-eventstream (1.2.0)
@@ -24,18 +37,64 @@ GEM
     aws-sigv4 (1.6.0)
       aws-eventstream (~> 1, >= 1.0.2)
     babosa (1.0.4)
+    base64 (0.2.0)
+    bigdecimal (3.1.6)
     claide (1.1.0)
+    cocoapods (1.14.3)
+      addressable (~> 2.8)
+      claide (>= 1.0.2, < 2.0)
+      cocoapods-core (= 1.14.3)
+      cocoapods-deintegrate (>= 1.0.3, < 2.0)
+      cocoapods-downloader (>= 2.1, < 3.0)
+      cocoapods-plugins (>= 1.0.0, < 2.0)
+      cocoapods-search (>= 1.0.0, < 2.0)
+      cocoapods-trunk (>= 1.6.0, < 2.0)
+      cocoapods-try (>= 1.1.0, < 2.0)
+      colored2 (~> 3.1)
+      escape (~> 0.0.4)
+      fourflusher (>= 2.3.0, < 3.0)
+      gh_inspector (~> 1.0)
+      molinillo (~> 0.8.0)
+      nap (~> 1.0)
+      ruby-macho (>= 2.3.0, < 3.0)
+      xcodeproj (>= 1.23.0, < 2.0)
+    cocoapods-core (1.14.3)
+      activesupport (>= 5.0, < 8)
+      addressable (~> 2.8)
+      algoliasearch (~> 1.0)
+      concurrent-ruby (~> 1.1)
+      fuzzy_match (~> 2.0.4)
+      nap (~> 1.0)
+      netrc (~> 0.11)
+      public_suffix (~> 4.0)
+      typhoeus (~> 1.0)
+    cocoapods-deintegrate (1.0.5)
+    cocoapods-downloader (2.1)
+    cocoapods-plugins (1.0.0)
+      nap
+    cocoapods-search (1.0.1)
+    cocoapods-trunk (1.6.0)
+      nap (>= 0.8, < 2.0)
+      netrc (~> 0.11)
+    cocoapods-try (1.2.0)
     colored (1.2)
     colored2 (3.1.2)
     commander (4.6.0)
       highline (~> 2.0.0)
+    concurrent-ruby (1.2.3)
+    connection_pool (2.4.1)
     declarative (0.0.20)
     digest-crc (0.6.5)
       rake (>= 12.0.0, < 14.0.0)
     domain_name (0.5.20190701)
       unf (>= 0.0.5, < 1.0.0)
     dotenv (2.8.1)
+    drb (2.2.0)
+      ruby2_keywords
     emoji_regex (3.2.3)
+    escape (0.0.4)
+    ethon (0.16.0)
+      ffi (>= 1.15.0)
     excon (0.102.0)
     faraday (1.10.3)
       faraday-em_http (~> 1.0)
@@ -107,6 +166,9 @@ GEM
       xcpretty-travis-formatter (>= 0.0.3)
     fastlane-plugin-firebase_app_distribution (0.7.2)
       google-apis-firebaseappdistribution_v1 (~> 0.3.0)
+    ffi (1.16.3)
+    fourflusher (2.3.1)
+    fuzzy_match (2.0.4)
     gh_inspector (1.1.3)
     google-apis-androidpublisher_v3 (0.48.0)
       google-apis-core (>= 0.11.0, < 2.a)
@@ -152,20 +214,27 @@ GEM
     http-cookie (1.0.5)
       domain_name (~> 0.5)
     httpclient (2.8.3)
+    i18n (1.14.1)
+      concurrent-ruby (~> 1.0)
     jmespath (1.6.2)
     json (2.6.3)
     jwt (2.7.1)
     memoist (0.16.2)
     mini_magick (4.12.0)
     mini_mime (1.1.5)
+    minitest (5.22.1)
+    molinillo (0.8.0)
     multi_json (1.15.0)
     multipart-post (2.3.0)
+    mutex_m (0.2.0)
     nanaimo (0.3.0)
+    nap (1.1.0)
     naturally (2.2.1)
+    netrc (0.11.0)
     optparse (0.1.1)
     os (1.1.4)
     plist (3.7.0)
-    public_suffix (5.0.3)
+    public_suffix (4.0.7)
     rake (13.0.6)
     representable (3.2.0)
       declarative (< 0.1.0)
@@ -174,6 +243,7 @@ GEM
     retriable (3.1.2)
     rexml (3.2.6)
     rouge (2.0.7)
+    ruby-macho (2.5.1)
     ruby2_keywords (0.0.5)
     rubyzip (2.3.2)
     security (0.1.3)
@@ -193,6 +263,10 @@ GEM
     tty-screen (0.8.1)
     tty-spinner (0.9.3)
       tty-cursor (~> 0.7)
+    typhoeus (1.4.1)
+      ethon (>= 0.9.0)
+    tzinfo (2.0.6)
+      concurrent-ruby (~> 1.0)
     uber (0.1.0)
     unf (0.1.4)
       unf_ext
@@ -200,7 +274,7 @@ GEM
     unicode-display_width (1.8.0)
     webrick (1.8.1)
     word_wrap (1.0.0)
-    xcodeproj (1.22.0)
+    xcodeproj (1.24.0)
       CFPropertyList (>= 2.3.3, < 4.0)
       atomos (~> 0.1.3)
       claide (>= 1.0.2, < 2.0)
@@ -216,6 +290,7 @@ PLATFORMS
   ruby
 
 DEPENDENCIES
+  cocoapods (~> 1.14.3)
   fastlane
   fastlane-plugin-firebase_app_distribution
 
diff --git a/ios/Podfile.lock b/ios/Podfile.lock
index 972daffce..7534963e5 100644
--- a/ios/Podfile.lock
+++ b/ios/Podfile.lock
@@ -38,4 +38,4 @@ SPEC CHECKSUMS:
 
 PODFILE CHECKSUM: 7368163408c647b7eb699d0d788ba6718e18fb8d
 
-COCOAPODS: 1.14.3
+COCOAPODS: 1.15.2
diff --git a/lib/app/shared/widgets/button/widgetbook.dart b/lib/app/shared/widgets/button/widgetbook.dart
new file mode 100644
index 000000000..ac81bbb08
--- /dev/null
+++ b/lib/app/shared/widgets/button/widgetbook.dart
@@ -0,0 +1,37 @@
+import 'package:flutter/material.dart';
+import 'package:ice/app/shared/widgets/button/button.dart';
+import 'package:widgetbook/widgetbook.dart';
+import 'package:widgetbook_annotation/widgetbook_annotation.dart' as widgetbook;
+
+@widgetbook.UseCase(
+  name: 'with green color',
+  type: Button,
+)
+Widget greenContainerUseCase(BuildContext context) {
+  return Center(
+    child: Button(
+      type: ButtonType.outlined,
+      label: Text(
+        context.knobs.string(
+          label: 'Title',
+          initialValue: 'Controllable Title',
+        ),
+      ),
+      onPressed: () {},
+    ),
+  );
+}
+
+@widgetbook.UseCase(
+  name: 'with red color',
+  type: Button,
+)
+Widget redContainerUseCase(BuildContext context) {
+  return Center(
+    child: Button(
+      type: ButtonType.disabled,
+      label: const Text('Text'),
+      onPressed: () {},
+    ),
+  );
+}
diff --git a/lib/main.dart b/lib/main.dart
index 0c24d8ee6..d1953b3da 100644
--- a/lib/main.dart
+++ b/lib/main.dart
@@ -32,12 +32,8 @@ class IceApp extends HookConsumerWidget {
       builder: (BuildContext context, Widget? widget) => MaterialApp.router(
         localizationsDelegates: I18n.localizationsDelegates,
         supportedLocales: I18n.supportedLocales,
-        theme: template.whenOrNull(
-          data: (Template data) => buildLightTheme(data),
-        ),
-        darkTheme: template.whenOrNull(
-          data: (Template data) => buildDarkTheme(data),
-        ),
+        theme: template.whenOrNull(data: buildLightTheme),
+        darkTheme: template.whenOrNull(data: buildDarkTheme),
         themeMode: appThemeMode,
         routerConfig: appRouter,
       ),
diff --git a/lib/widgetbook/README.md b/lib/widgetbook/README.md
new file mode 100644
index 000000000..cf8dedd53
--- /dev/null
+++ b/lib/widgetbook/README.md
@@ -0,0 +1 @@
+# A playground to streamline shared UI Widgets with Widgetbook
\ No newline at end of file
diff --git a/lib/widgetbook/main.dart b/lib/widgetbook/main.dart
new file mode 100644
index 000000000..290a61fb8
--- /dev/null
+++ b/lib/widgetbook/main.dart
@@ -0,0 +1,50 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_screenutil/flutter_screenutil.dart';
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:ice/app/features/core/providers/init_provider.dart';
+import 'package:ice/app/features/core/providers/template_provider.dart';
+import 'package:ice/app/features/core/providers/theme_mode_provider.dart';
+import 'package:ice/app/templates/template.dart';
+import 'package:ice/app/theme/theme.dart';
+import 'package:ice/generated/app_localizations.dart';
+import 'package:ice/widgetbook/main.directories.g.dart';
+import 'package:widgetbook/widgetbook.dart';
+import 'package:widgetbook_annotation/widgetbook_annotation.dart' as widgetbook;
+
+void main() {
+  runApp(const ProviderScope(child: WidgetbookApp()));
+}
+
+@widgetbook.App()
+class WidgetbookApp extends ConsumerWidget {
+  const WidgetbookApp({super.key});
+
+  @override
+  Widget build(BuildContext context, WidgetRef ref) {
+    final AsyncValue<void> init = ref.watch(initAppProvider);
+
+    return init.when(
+      data: (void data) => Widgetbook.material(
+        directories: directories,
+        appBuilder: (BuildContext context, Widget child) {
+          final ThemeMode appThemeMode = ref.watch(appThemeModeProvider);
+          final AsyncValue<Template> template = ref.watch(templateProvider);
+
+          return ScreenUtilInit(
+            designSize: const Size(375, 812),
+            builder: (BuildContext context, Widget? widget) => MaterialApp(
+              localizationsDelegates: I18n.localizationsDelegates,
+              supportedLocales: I18n.supportedLocales,
+              theme: template.whenOrNull(data: buildLightTheme),
+              darkTheme: template.whenOrNull(data: buildDarkTheme),
+              themeMode: appThemeMode,
+              home: child,
+            ),
+          );
+        },
+      ),
+      error: (Object err, StackTrace stack) => Text(err.toString()),
+      loading: () => const CircularProgressIndicator(),
+    );
+  }
+}
diff --git a/macos/Podfile.lock b/macos/Podfile.lock
new file mode 100644
index 000000000..21bec1a83
--- /dev/null
+++ b/macos/Podfile.lock
@@ -0,0 +1,22 @@
+PODS:
+  - file_selector_macos (0.0.1):
+    - FlutterMacOS
+  - FlutterMacOS (1.0.0)
+
+DEPENDENCIES:
+  - file_selector_macos (from `Flutter/ephemeral/.symlinks/plugins/file_selector_macos/macos`)
+  - FlutterMacOS (from `Flutter/ephemeral`)
+
+EXTERNAL SOURCES:
+  file_selector_macos:
+    :path: Flutter/ephemeral/.symlinks/plugins/file_selector_macos/macos
+  FlutterMacOS:
+    :path: Flutter/ephemeral
+
+SPEC CHECKSUMS:
+  file_selector_macos: 468fb6b81fac7c0e88d71317f3eec34c3b008ff9
+  FlutterMacOS: 8f6f14fa908a6fb3fba0cd85dbd81ec4b251fb24
+
+PODFILE CHECKSUM: 236401fc2c932af29a9fcf0e97baeeb2d750d367
+
+COCOAPODS: 1.14.3
diff --git a/macos/Runner.xcodeproj/project.pbxproj b/macos/Runner.xcodeproj/project.pbxproj
index 0735da7f9..4bb788385 100644
--- a/macos/Runner.xcodeproj/project.pbxproj
+++ b/macos/Runner.xcodeproj/project.pbxproj
@@ -21,6 +21,8 @@
 /* End PBXAggregateTarget section */
 
 /* Begin PBXBuildFile section */
+		0E0392731AFAE3E71D7AFD64 /* Pods_RunnerTests.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = F539E043AF0104150C41423C /* Pods_RunnerTests.framework */; };
+		2F175856114C3EC83547F634 /* Pods_Runner.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = 67D77B32DE277D4DA52F6FA7 /* Pods_Runner.framework */; };
 		331C80D8294CF71000263BE5 /* RunnerTests.swift in Sources */ = {isa = PBXBuildFile; fileRef = 331C80D7294CF71000263BE5 /* RunnerTests.swift */; };
 		335BBD1B22A9A15E00E9071D /* GeneratedPluginRegistrant.swift in Sources */ = {isa = PBXBuildFile; fileRef = 335BBD1A22A9A15E00E9071D /* GeneratedPluginRegistrant.swift */; };
 		33CC10F12044A3C60003C045 /* AppDelegate.swift in Sources */ = {isa = PBXBuildFile; fileRef = 33CC10F02044A3C60003C045 /* AppDelegate.swift */; };
@@ -60,11 +62,12 @@
 /* End PBXCopyFilesBuildPhase section */
 
 /* Begin PBXFileReference section */
+		161A41B913FD8159A2BAB69F /* Pods-RunnerTests.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-RunnerTests.debug.xcconfig"; path = "Target Support Files/Pods-RunnerTests/Pods-RunnerTests.debug.xcconfig"; sourceTree = "<group>"; };
 		331C80D5294CF71000263BE5 /* RunnerTests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = RunnerTests.xctest; sourceTree = BUILT_PRODUCTS_DIR; };
 		331C80D7294CF71000263BE5 /* RunnerTests.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = RunnerTests.swift; sourceTree = "<group>"; };
 		333000ED22D3DE5D00554162 /* Warnings.xcconfig */ = {isa = PBXFileReference; lastKnownFileType = text.xcconfig; path = Warnings.xcconfig; sourceTree = "<group>"; };
 		335BBD1A22A9A15E00E9071D /* GeneratedPluginRegistrant.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = GeneratedPluginRegistrant.swift; sourceTree = "<group>"; };
-		33CC10ED2044A3C60003C045 /* ice.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = "ice.app"; sourceTree = BUILT_PRODUCTS_DIR; };
+		33CC10ED2044A3C60003C045 /* ice.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = ice.app; sourceTree = BUILT_PRODUCTS_DIR; };
 		33CC10F02044A3C60003C045 /* AppDelegate.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AppDelegate.swift; sourceTree = "<group>"; };
 		33CC10F22044A3C60003C045 /* Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; name = Assets.xcassets; path = Runner/Assets.xcassets; sourceTree = "<group>"; };
 		33CC10F52044A3C60003C045 /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.xib; name = Base; path = Base.lproj/MainMenu.xib; sourceTree = "<group>"; };
@@ -76,8 +79,15 @@
 		33E51913231747F40026EE4D /* DebugProfile.entitlements */ = {isa = PBXFileReference; lastKnownFileType = text.plist.entitlements; path = DebugProfile.entitlements; sourceTree = "<group>"; };
 		33E51914231749380026EE4D /* Release.entitlements */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.entitlements; path = Release.entitlements; sourceTree = "<group>"; };
 		33E5194F232828860026EE4D /* AppInfo.xcconfig */ = {isa = PBXFileReference; lastKnownFileType = text.xcconfig; path = AppInfo.xcconfig; sourceTree = "<group>"; };
+		411E1533195E77FE53AE8FCA /* Pods-RunnerTests.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-RunnerTests.release.xcconfig"; path = "Target Support Files/Pods-RunnerTests/Pods-RunnerTests.release.xcconfig"; sourceTree = "<group>"; };
+		67D77B32DE277D4DA52F6FA7 /* Pods_Runner.framework */ = {isa = PBXFileReference; explicitFileType = wrapper.framework; includeInIndex = 0; path = Pods_Runner.framework; sourceTree = BUILT_PRODUCTS_DIR; };
 		7AFA3C8E1D35360C0083082E /* Release.xcconfig */ = {isa = PBXFileReference; lastKnownFileType = text.xcconfig; path = Release.xcconfig; sourceTree = "<group>"; };
+		8DE189F58B8D7DC3880D36C0 /* Pods-Runner.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-Runner.release.xcconfig"; path = "Target Support Files/Pods-Runner/Pods-Runner.release.xcconfig"; sourceTree = "<group>"; };
+		92A5FD7567DD7E002BD07466 /* Pods-RunnerTests.profile.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-RunnerTests.profile.xcconfig"; path = "Target Support Files/Pods-RunnerTests/Pods-RunnerTests.profile.xcconfig"; sourceTree = "<group>"; };
 		9740EEB21CF90195004384FC /* Debug.xcconfig */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.xcconfig; path = Debug.xcconfig; sourceTree = "<group>"; };
+		B67E4AA861B37DCD9E18EA19 /* Pods-Runner.profile.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-Runner.profile.xcconfig"; path = "Target Support Files/Pods-Runner/Pods-Runner.profile.xcconfig"; sourceTree = "<group>"; };
+		ECADECED189C07808C64906C /* Pods-Runner.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-Runner.debug.xcconfig"; path = "Target Support Files/Pods-Runner/Pods-Runner.debug.xcconfig"; sourceTree = "<group>"; };
+		F539E043AF0104150C41423C /* Pods_RunnerTests.framework */ = {isa = PBXFileReference; explicitFileType = wrapper.framework; includeInIndex = 0; path = Pods_RunnerTests.framework; sourceTree = BUILT_PRODUCTS_DIR; };
 /* End PBXFileReference section */
 
 /* Begin PBXFrameworksBuildPhase section */
@@ -85,6 +95,7 @@
 			isa = PBXFrameworksBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
+				0E0392731AFAE3E71D7AFD64 /* Pods_RunnerTests.framework in Frameworks */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};
@@ -92,6 +103,7 @@
 			isa = PBXFrameworksBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
+				2F175856114C3EC83547F634 /* Pods_Runner.framework in Frameworks */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};
@@ -125,6 +137,7 @@
 				331C80D6294CF71000263BE5 /* RunnerTests */,
 				33CC10EE2044A3C60003C045 /* Products */,
 				D73912EC22F37F3D000D13A0 /* Frameworks */,
+				3A7BE43E36C6F24A4804A01D /* Pods */,
 			);
 			sourceTree = "<group>";
 		};
@@ -172,9 +185,25 @@
 			path = Runner;
 			sourceTree = "<group>";
 		};
+		3A7BE43E36C6F24A4804A01D /* Pods */ = {
+			isa = PBXGroup;
+			children = (
+				ECADECED189C07808C64906C /* Pods-Runner.debug.xcconfig */,
+				8DE189F58B8D7DC3880D36C0 /* Pods-Runner.release.xcconfig */,
+				B67E4AA861B37DCD9E18EA19 /* Pods-Runner.profile.xcconfig */,
+				161A41B913FD8159A2BAB69F /* Pods-RunnerTests.debug.xcconfig */,
+				411E1533195E77FE53AE8FCA /* Pods-RunnerTests.release.xcconfig */,
+				92A5FD7567DD7E002BD07466 /* Pods-RunnerTests.profile.xcconfig */,
+			);
+			name = Pods;
+			path = Pods;
+			sourceTree = "<group>";
+		};
 		D73912EC22F37F3D000D13A0 /* Frameworks */ = {
 			isa = PBXGroup;
 			children = (
+				67D77B32DE277D4DA52F6FA7 /* Pods_Runner.framework */,
+				F539E043AF0104150C41423C /* Pods_RunnerTests.framework */,
 			);
 			name = Frameworks;
 			sourceTree = "<group>";
@@ -186,6 +215,7 @@
 			isa = PBXNativeTarget;
 			buildConfigurationList = 331C80DE294CF71000263BE5 /* Build configuration list for PBXNativeTarget "RunnerTests" */;
 			buildPhases = (
+				60ECC2511FCD4FE5E3C797E3 /* [CP] Check Pods Manifest.lock */,
 				331C80D1294CF70F00263BE5 /* Sources */,
 				331C80D2294CF70F00263BE5 /* Frameworks */,
 				331C80D3294CF70F00263BE5 /* Resources */,
@@ -204,11 +234,13 @@
 			isa = PBXNativeTarget;
 			buildConfigurationList = 33CC10FB2044A3C60003C045 /* Build configuration list for PBXNativeTarget "Runner" */;
 			buildPhases = (
+				5F4D84B95181A1EDD1C01F29 /* [CP] Check Pods Manifest.lock */,
 				33CC10E92044A3C60003C045 /* Sources */,
 				33CC10EA2044A3C60003C045 /* Frameworks */,
 				33CC10EB2044A3C60003C045 /* Resources */,
 				33CC110E2044A8840003C045 /* Bundle Framework */,
 				3399D490228B24CF009A79C7 /* ShellScript */,
+				B742006CCDF39A9B038A6726 /* [CP] Embed Pods Frameworks */,
 			);
 			buildRules = (
 			);
@@ -328,6 +360,67 @@
 			shellPath = /bin/sh;
 			shellScript = "\"$FLUTTER_ROOT\"/packages/flutter_tools/bin/macos_assemble.sh && touch Flutter/ephemeral/tripwire";
 		};
+		5F4D84B95181A1EDD1C01F29 /* [CP] Check Pods Manifest.lock */ = {
+			isa = PBXShellScriptBuildPhase;
+			buildActionMask = 2147483647;
+			files = (
+			);
+			inputFileListPaths = (
+			);
+			inputPaths = (
+				"${PODS_PODFILE_DIR_PATH}/Podfile.lock",
+				"${PODS_ROOT}/Manifest.lock",
+			);
+			name = "[CP] Check Pods Manifest.lock";
+			outputFileListPaths = (
+			);
+			outputPaths = (
+				"$(DERIVED_FILE_DIR)/Pods-Runner-checkManifestLockResult.txt",
+			);
+			runOnlyForDeploymentPostprocessing = 0;
+			shellPath = /bin/sh;
+			shellScript = "diff \"${PODS_PODFILE_DIR_PATH}/Podfile.lock\" \"${PODS_ROOT}/Manifest.lock\" > /dev/null\nif [ $? != 0 ] ; then\n    # print error to STDERR\n    echo \"error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.\" >&2\n    exit 1\nfi\n# This output is used by Xcode 'outputs' to avoid re-running this script phase.\necho \"SUCCESS\" > \"${SCRIPT_OUTPUT_FILE_0}\"\n";
+			showEnvVarsInLog = 0;
+		};
+		60ECC2511FCD4FE5E3C797E3 /* [CP] Check Pods Manifest.lock */ = {
+			isa = PBXShellScriptBuildPhase;
+			buildActionMask = 2147483647;
+			files = (
+			);
+			inputFileListPaths = (
+			);
+			inputPaths = (
+				"${PODS_PODFILE_DIR_PATH}/Podfile.lock",
+				"${PODS_ROOT}/Manifest.lock",
+			);
+			name = "[CP] Check Pods Manifest.lock";
+			outputFileListPaths = (
+			);
+			outputPaths = (
+				"$(DERIVED_FILE_DIR)/Pods-RunnerTests-checkManifestLockResult.txt",
+			);
+			runOnlyForDeploymentPostprocessing = 0;
+			shellPath = /bin/sh;
+			shellScript = "diff \"${PODS_PODFILE_DIR_PATH}/Podfile.lock\" \"${PODS_ROOT}/Manifest.lock\" > /dev/null\nif [ $? != 0 ] ; then\n    # print error to STDERR\n    echo \"error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.\" >&2\n    exit 1\nfi\n# This output is used by Xcode 'outputs' to avoid re-running this script phase.\necho \"SUCCESS\" > \"${SCRIPT_OUTPUT_FILE_0}\"\n";
+			showEnvVarsInLog = 0;
+		};
+		B742006CCDF39A9B038A6726 /* [CP] Embed Pods Frameworks */ = {
+			isa = PBXShellScriptBuildPhase;
+			buildActionMask = 2147483647;
+			files = (
+			);
+			inputFileListPaths = (
+				"${PODS_ROOT}/Target Support Files/Pods-Runner/Pods-Runner-frameworks-${CONFIGURATION}-input-files.xcfilelist",
+			);
+			name = "[CP] Embed Pods Frameworks";
+			outputFileListPaths = (
+				"${PODS_ROOT}/Target Support Files/Pods-Runner/Pods-Runner-frameworks-${CONFIGURATION}-output-files.xcfilelist",
+			);
+			runOnlyForDeploymentPostprocessing = 0;
+			shellPath = /bin/sh;
+			shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-Runner/Pods-Runner-frameworks.sh\"\n";
+			showEnvVarsInLog = 0;
+		};
 /* End PBXShellScriptBuildPhase section */
 
 /* Begin PBXSourcesBuildPhase section */
@@ -379,6 +472,7 @@
 /* Begin XCBuildConfiguration section */
 		331C80DB294CF71000263BE5 /* Debug */ = {
 			isa = XCBuildConfiguration;
+			baseConfigurationReference = 161A41B913FD8159A2BAB69F /* Pods-RunnerTests.debug.xcconfig */;
 			buildSettings = {
 				BUNDLE_LOADER = "$(TEST_HOST)";
 				CURRENT_PROJECT_VERSION = 1;
@@ -393,6 +487,7 @@
 		};
 		331C80DC294CF71000263BE5 /* Release */ = {
 			isa = XCBuildConfiguration;
+			baseConfigurationReference = 411E1533195E77FE53AE8FCA /* Pods-RunnerTests.release.xcconfig */;
 			buildSettings = {
 				BUNDLE_LOADER = "$(TEST_HOST)";
 				CURRENT_PROJECT_VERSION = 1;
@@ -407,6 +502,7 @@
 		};
 		331C80DD294CF71000263BE5 /* Profile */ = {
 			isa = XCBuildConfiguration;
+			baseConfigurationReference = 92A5FD7567DD7E002BD07466 /* Pods-RunnerTests.profile.xcconfig */;
 			buildSettings = {
 				BUNDLE_LOADER = "$(TEST_HOST)";
 				CURRENT_PROJECT_VERSION = 1;
diff --git a/macos/Runner.xcworkspace/contents.xcworkspacedata b/macos/Runner.xcworkspace/contents.xcworkspacedata
index 1d526a16e..21a3cc14c 100644
--- a/macos/Runner.xcworkspace/contents.xcworkspacedata
+++ b/macos/Runner.xcworkspace/contents.xcworkspacedata
@@ -4,4 +4,7 @@
    <FileRef
       location = "group:Runner.xcodeproj">
    </FileRef>
+   <FileRef
+      location = "group:Pods/Pods.xcodeproj">
+   </FileRef>
 </Workspace>
diff --git a/pubspec.lock b/pubspec.lock
index b1194331f..a5ef446b5 100644
--- a/pubspec.lock
+++ b/pubspec.lock
@@ -9,6 +9,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "64.0.0"
+  accessibility_tools:
+    dependency: transitive
+    description:
+      name: accessibility_tools
+      sha256: "0a16adc8dfa3a7ebd38775135d86443011a65d4ecbb438913e4992b5d29135fe"
+      url: "https://pub.dev"
+    source: hosted
+    version: "1.0.0"
   analyzer:
     dependency: transitive
     description:
@@ -93,10 +101,10 @@ packages:
     dependency: "direct dev"
     description:
       name: build_runner
-      sha256: "10c6bcdbf9d049a0b666702cf1cee4ddfdc38f02a19d35ae392863b47519848b"
+      sha256: "581bacf68f89ec8792f5e5a0b2c4decd1c948e97ce659dc783688c8a88fbec21"
       url: "https://pub.dev"
     source: hosted
-    version: "2.4.6"
+    version: "2.4.8"
   build_runner_core:
     dependency: transitive
     description:
@@ -257,6 +265,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "1.2.0"
+  device_frame:
+    dependency: transitive
+    description:
+      name: device_frame
+      sha256: afe76182aec178d171953d9b4a50a43c57c7cf3c77d8b09a48bf30c8fa04dd9d
+      url: "https://pub.dev"
+    source: hosted
+    version: "1.1.0"
   email_validator:
     dependency: "direct main"
     description:
@@ -645,6 +661,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "0.2.1+1"
+  inspector:
+    dependency: transitive
+    description:
+      name: inspector
+      sha256: "40ba0ac1c819c85139bfec9d1e283804581a8985c91f19d00e93212cf29226b1"
+      url: "https://pub.dev"
+    source: hosted
+    version: "2.1.0"
   intl:
     dependency: "direct main"
     description:
@@ -749,6 +773,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "1.0.4"
+  nested:
+    dependency: transitive
+    description:
+      name: nested
+      sha256: "03bac4c528c64c95c722ec99280375a6f2fc708eec17c7b3f07253b626cd2a20"
+      url: "https://pub.dev"
+    source: hosted
+    version: "1.0.0"
   package_config:
     dependency: transitive
     description:
@@ -821,6 +853,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "1.2.3"
+  resizable_widget:
+    dependency: transitive
+    description:
+      name: resizable_widget
+      sha256: db2919754b93f386b9b3fb15e9f48f6c9d6d41f00a24397629133c99df86606a
+      url: "https://pub.dev"
+    source: hosted
+    version: "1.0.5"
   riverpod:
     dependency: transitive
     description:
@@ -1050,6 +1090,30 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "2.4.0"
+  widgetbook:
+    dependency: "direct main"
+    description:
+      name: widgetbook
+      sha256: be0588cd864a70bd2817ca2fab0dbd147c460b712cfe53fd13e6fd46b5c3f368
+      url: "https://pub.dev"
+    source: hosted
+    version: "3.7.1"
+  widgetbook_annotation:
+    dependency: "direct main"
+    description:
+      name: widgetbook_annotation
+      sha256: c2d881d0241525b36aa3777d0ac406d198528ed28b84ca73b7dd9f59189d6bb0
+      url: "https://pub.dev"
+    source: hosted
+    version: "3.1.0"
+  widgetbook_generator:
+    dependency: "direct dev"
+    description:
+      name: widgetbook_generator
+      sha256: d81512780bb4d137d59f0694328f446433fe5228cf8191e918046cc4f09c128b
+      url: "https://pub.dev"
+    source: hosted
+    version: "3.7.0"
   xml:
     dependency: transitive
     description:
diff --git a/pubspec.yaml b/pubspec.yaml
index 8b79ed238..e80e4ca6a 100644
--- a/pubspec.yaml
+++ b/pubspec.yaml
@@ -29,12 +29,14 @@ dependencies:
   flutter_keyboard_visibility: ^5.4.1
   flutter_screenutil: ^5.9.0
   pin_code_fields: ^8.0.1
+  widgetbook_annotation: ^3.1.0
+  widgetbook: ^3.7.1
 
 dev_dependencies:
   flutter_test:
     sdk: flutter
   flutter_lints: ^3.0.1
-  build_runner: ^2.4.6
+  build_runner: ^2.4.8
   flutter_gen_runner: ^5.3.1
   lint: ^2.1.2
   freezed: ^2.4.1
@@ -44,6 +46,7 @@ dev_dependencies:
   custom_lint: ^0.5.3
   riverpod_lint: ^2.0.4
   go_router_builder: ^2.3.1
+  widgetbook_generator: ^3.7.0
 
 flutter:
   generate: true
diff --git a/scripts/generate_code.sh b/scripts/generate_code.sh
index 4d612e215..9b197fb9f 100755
--- a/scripts/generate_code.sh
+++ b/scripts/generate_code.sh
@@ -3,4 +3,5 @@
 # https://pub.dev/packages/flutter_gen
 # https://pub.dev/packages/freezed
 # https://pub.dev/packages/json_serializable
+# https://pub.dev/packages/widgetbook
 flutter pub run build_runner build --delete-conflicting-outputs
\ No newline at end of file