diff --git a/packages/frontend/.eslintrc.js b/packages/frontend/.eslintrc.js
index e8e0e57d2abb7978827e9ab78a8f8a1d11935206..0b7750c9f60fc7b4bf74f628b536ecc5d4092924 100644
--- a/packages/frontend/.eslintrc.js
+++ b/packages/frontend/.eslintrc.js
@@ -82,6 +82,7 @@ module.exports = {
 		'_LANGS_': false,
 		'_VERSION_': false,
 		'_ENV_': false,
+		'_IS_CHROMATIC_': false,
 		'_PERF_PREFIX_': false,
 		'_DATA_TRANSFER_DRIVE_FILE_': false,
 		'_DATA_TRANSFER_DRIVE_FOLDER_': false,
diff --git a/packages/frontend/.storybook/main.ts b/packages/frontend/.storybook/main.ts
index 1d0ce5ab63c914bb5f72baceef418ed6b9b6a78f..80628d9bc6951ac6b0db8b80a2b3e4674cb60df5 100644
--- a/packages/frontend/.storybook/main.ts
+++ b/packages/frontend/.storybook/main.ts
@@ -32,6 +32,9 @@ const config = {
 					rootDir: config.root ?? process.cwd(),
 				}),
 			],
+			define: {
+				_IS_CHROMATIC_: true,
+			},
 			build: {
 				target: [
 					'chrome108',
diff --git a/packages/frontend/@types/global.d.ts b/packages/frontend/@types/global.d.ts
index c75748290008830b7daaf0400d19b6804c0756be..e91d341be7f4b3820278bb40cfb427a5ddbd392e 100644
--- a/packages/frontend/@types/global.d.ts
+++ b/packages/frontend/@types/global.d.ts
@@ -4,6 +4,7 @@ declare const _LANGS_: string[][];
 declare const _VERSION_: string;
 declare const _ENV_: string;
 declare const _DEV_: boolean;
+declare const _IS_CHROMATIC_: boolean;
 declare const _PERF_PREFIX_: string;
 declare const _DATA_TRANSFER_DRIVE_FILE_: string;
 declare const _DATA_TRANSFER_DRIVE_FOLDER_: string;
diff --git a/packages/frontend/src/components/MkAnimBg.vue b/packages/frontend/src/components/MkAnimBg.vue
index 5a5c427cf1b155f6327a7024690b43445f470874..6b42c158cb4b8b78de5eac4533f5a1450e456701 100644
--- a/packages/frontend/src/components/MkAnimBg.vue
+++ b/packages/frontend/src/components/MkAnimBg.vue
@@ -4,7 +4,6 @@
 
 <script lang="ts" setup>
 import { onMounted, onUnmounted, shallowRef } from 'vue';
-import isChromatic from 'chromatic/isChromatic';
 
 const canvasEl = shallowRef<HTMLCanvasElement>();
 
@@ -204,7 +203,7 @@ onMounted(() => {
 	const vertices = [1.0, 1.0, -1.0, 1.0, 1.0, -1.0, -1.0, -1.0];
 	gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.DYNAMIC_DRAW);
 
-	if (isChromatic()) {
+	if (_IS_CHROMATIC_) {
 		gl!.uniform1f(u_time, 0);
 		gl!.drawArrays(gl!.TRIANGLE_STRIP, 0, 4);
 	} else {
diff --git a/packages/frontend/vite.config.ts b/packages/frontend/vite.config.ts
index 339761e78cb39edd8b03c7ebbf005673f3b1986f..a2a9bb3f56f630acd9e77cc1590d7e8bba935428 100644
--- a/packages/frontend/vite.config.ts
+++ b/packages/frontend/vite.config.ts
@@ -95,6 +95,7 @@ export function getConfig(): UserConfig {
 			_LANGS_: JSON.stringify(Object.entries(locales).map(([k, v]) => [k, v._lang_])),
 			_ENV_: JSON.stringify(process.env.NODE_ENV),
 			_DEV_: process.env.NODE_ENV !== 'production',
+			_IS_CHROMATIC_: false,
 			_PERF_PREFIX_: JSON.stringify('Misskey:'),
 			_DATA_TRANSFER_DRIVE_FILE_: JSON.stringify('mk_drive_file'),
 			_DATA_TRANSFER_DRIVE_FOLDER_: JSON.stringify('mk_drive_folder'),