Add letter spacing

components/domain/wishes/createWish/CreateWish.tsx

@@ -19,7 +19,7 @@ const CreateWish: FC<CreateWishProps> = (props) => {
             type="text"
             name="wishName"
             placeholder="Your wish!"
-            className="w-full appearance-none bg-pink-100 p-6 text-center text-lg outline-none"
+            className="w-full appearance-none bg-pink-100 p-6 text-center text-xl outline-none font-medium"
             onChange={(e) =>
               props.onSubmit({ ...props.wish, name: e.target.value })
             }

styles/globals.css

@@ -1,3 +1,7 @@
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
+
+* {
+    @apply tracking-normal;
+}

tailwind.config.js

@@ -4,10 +4,21 @@ module.exports = {
     './components/**/*.{js,ts,jsx,tsx}',
   ],
   theme: {
-    extend: {
-      fontFamily: {
-        sans: ['"Dancing Script"', 'cursive'],
-      },
+    extend: {},
+
+    fontFamily: {
+      sans: ['"Dancing Script"', 'cursive'],
+    },
+
+    letterSpacing: {
+      tightest: '-.075em',
+      tighter: '-.05em',
+      tight: '-.025em',
+      normal: '0.03em',
+      wide: '.045em',
+      wider: '.07em',
+      widest: '.1em',
+      widest: '.25em',
     },
   },
   plugins: [],