diff --git a/frontend/src/index.css b/frontend/src/index.css
index 052faac..96489cd 100644
--- a/frontend/src/index.css
+++ b/frontend/src/index.css
@@ -7,6 +7,7 @@
   body
   {
     @apply overflow-x-clip;
+    @apply font-jpSans;
   }
 
   a
diff --git a/frontend/tailwind.config.js b/frontend/tailwind.config.js
index a56efa4..dd99906 100644
--- a/frontend/tailwind.config.js
+++ b/frontend/tailwind.config.js
@@ -2,35 +2,41 @@
 import type { Config } from 'tailwindcss'
 
 import { DARK_COLOUR_SHADE,
-         LIGHT_COLOUR_SHADE,
-         TAG_COLOUR } from './src/consts'
+	 LIGHT_COLOUR_SHADE,
+	 TAG_COLOUR } from './src/consts'
 
 const colours = Object.values (TAG_COLOUR)
 
 export default {
-  content: ['./src/**/*.{html,js,ts,jsx,tsx}'],
-  safelist: [...colours.map (c => `text-${ c }-${ LIGHT_COLOUR_SHADE }`),
-             ...colours.map (c => `hover:text-${ c }-${ LIGHT_COLOUR_SHADE - 200 }`),
-             ...colours.map (c => `dark:text-${ c }-${ DARK_COLOUR_SHADE }`),
-             ...colours.map (c => `dark:hover:text-${ c }-${ DARK_COLOUR_SHADE - 200 }`)],
-  theme: {
-    extend: {
-      animation: {
-        'rainbow-scroll': 'rainbow-scroll .25s linear infinite',
-      },
-      colors: {
-        red: {
-          925: '#5f1414',
-          975: '#230505',
-        }
-      },
-      keyframes: {
-        'rainbow-scroll': {
-          '0%': { backgroundPosition: '0% 50%' },
-          '100%': { backgroundPosition: '200% 50%' },
-        },
-      },
-    }
-  },
-  plugins: [],
-} satisfies Config
+    content: ['./src/**/*.{html,js,ts,jsx,tsx}'],
+    safelist: [...colours.map (c => `text-${ c }-${ LIGHT_COLOUR_SHADE }`),
+	       ...colours.map (c => `hover:text-${ c }-${ LIGHT_COLOUR_SHADE - 200 }`),
+	       ...colours.map (c => `dark:text-${ c }-${ DARK_COLOUR_SHADE }`),
+	       ...colours.map (c => `dark:hover:text-${ c }-${ DARK_COLOUR_SHADE - 200 }`)],
+    theme: {
+	extend: {
+	    animation: {
+		'rainbow-scroll': 'rainbow-scroll .25s linear infinite' },
+	    colors: {
+		red: { 925: '#5f1414',
+		       975: '#230505' } },
+	    keyframes: {
+		'rainbow-scroll': {
+		    '0%':   { backgroundPosition: '0% 50%' },
+		    '100%': { backgroundPosition: '200% 50%' } } },
+	    fontFamily: {
+		jpSans: ['Noto Sans JP',
+			 'Hiragino Kaku Gothic ProN',
+			 'ヒラギノ角ゴ ProN W3',
+			 'Yu Gothic',
+			 '游ゴシック体',
+			 'Meiryo',
+			 'sans-serif'],
+		jpSerif: ['Noto Serif JP',
+			  'Hiragino Mincho ProN',
+			  'ヒラギノ明朝 ProN W3',
+			  'Yu Mincho',
+			  '游明朝',
+			  'MS PMincho',
+			  'serif'] } } },
+    plugins: [] } satisfies Config