diff --git a/prisma/migrations/20251121183219_add_is_colorful_column_to_board/migration.sql b/prisma/migrations/20251121183219_add_is_colorful_column_to_board/migration.sql
new file mode 100644
index 0000000..ed59427
--- /dev/null
+++ b/prisma/migrations/20251121183219_add_is_colorful_column_to_board/migration.sql
@@ -0,0 +1,8 @@
+/*
+  Warnings:
+
+  - Added the required column `isColorful` to the `Board` table without a default value. This is not possible if the table is not empty.
+
+*/
+-- AlterTable
+ALTER TABLE "Board" ADD COLUMN     "isColorful" BOOLEAN NOT NULL;
diff --git a/src/lib/api/board.ts b/src/lib/api/board.ts
index 9b7fbe6..97ef700 100644
--- a/src/lib/api/board.ts
+++ b/src/lib/api/board.ts
@@ -37,6 +37,7 @@ export type BoardListItem = {
   name: string;
   createdAt: string;
   preview: number[][];
+  isColorful: boolean;
 };
 
 export async function fetchBoardList(isJapanese: boolean): Promise<BoardListItem[] | undefined> {
diff --git a/src/lib/components/BoardModals.svelte b/src/lib/components/BoardModals.svelte
index 5f01c3f..cea3377 100644
--- a/src/lib/components/BoardModals.svelte
+++ b/src/lib/components/BoardModals.svelte
@@ -29,7 +29,7 @@
     selectedBoardId = null;
   }
 
-  function getCellColor(cell: number): string {
+  function getCellColor(cell: number, isColorful: boolean): string {
     const WHITE = 0xffffff;
 
     if (isColorful) {
@@ -71,7 +71,10 @@
             {#each manager.saveState.preview as row, i (i)}
               <div class="preview-row">
                 {#each row as cell, j (j)}
-                  <div class="preview-cell" style="background-color: {getCellColor(cell)}"></div>
+                  <div
+                    class="preview-cell"
+                    style="background-color: {getCellColor(cell, isColorful)}"
+                  ></div>
                 {/each}
               </div>
             {/each}
@@ -129,7 +132,7 @@
                         {#each row as cell, j (j)}
                           <div
                             class="preview-cell"
-                            style="background-color: {getCellColor(cell)}"
+                            style="background-color: {getCellColor(cell, item.isColorful)}"
                           ></div>
                         {/each}
                       </div>
diff --git a/src/routes/api/board/+server.ts b/src/routes/api/board/+server.ts
index 5ced9d9..94229fd 100644
--- a/src/routes/api/board/+server.ts
+++ b/src/routes/api/board/+server.ts
@@ -72,6 +72,7 @@ export async function GET({ url }) {
         name: true,
         createdAt: true,
         preview: true,
+        isColorful: true,
       },
     });