diff --git a/src/style/app.css b/src/style/app.css
index 8edb4953..eda4da21 100644
--- a/src/style/app.css
+++ b/src/style/app.css
@@ -24,6 +24,28 @@
   .action-card-title {
     @apply font-semibold text-2xl;
   }
+  
+  /* typeography */
+  /* headers */
+  .section-title {
+    @apply font-bold text-xl;
+  }
+  .label {
+    @apply font-bold text-base tracking-wide;
+  }
+  /* data */
+  .data-value-sm {
+    @apply font-data text-green text-sm;
+  }
+  .data-value-base {
+    @apply font-data text-green text-base;
+  }
+  .data-value-lg {
+    @apply font-data text-green text-lg;
+  }
+  .data-value-2xl {
+    @apply font-data text-green text-2xl;
+  }
 }
 
 @layer base {
diff --git a/tailwind.config.js b/tailwind.config.js
index 6037bb88..7206076e 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -40,7 +40,7 @@ export default {
         xs: '10px',
         sm: '12px',
         base: '14px',
-        l: '20px',
+        lg: '20px',
         xl: '25px',
         '2xl': '30px',
       },