2 files changed, 11 insertions, 19 deletions
diff --git a/src/view/screens/Storybook/Theming.tsx b/src/view/screens/Storybook/Theming.tsx
index a05443473..5b6763370 100644
--- a/src/view/screens/Storybook/Theming.tsx
+++ b/src/view/screens/Storybook/Theming.tsx
@@ -14,22 +14,22 @@ export function Theming() {
 
       <Text style={[a.font_bold, a.pt_xl, a.px_md]}>theme.atoms.text</Text>
 
-      <View style={[a.flex_1, t.atoms.border, a.border_t]} />
-      <Text style={[a.font_bold, t.atoms.text_contrast_600, a.px_md]}>
-        theme.atoms.text_contrast_600
+      <View style={[a.flex_1, t.atoms.border_contrast_high, a.border_t]} />
+      <Text style={[a.font_bold, t.atoms.text_contrast_high, a.px_md]}>
+        theme.atoms.text_contrast_high
       </Text>
 
-      <View style={[a.flex_1, t.atoms.border, a.border_t]} />
-      <Text style={[a.font_bold, t.atoms.text_contrast_500, a.px_md]}>
-        theme.atoms.text_contrast_500
+      <View style={[a.flex_1, t.atoms.border_contrast_medium, a.border_t]} />
+      <Text style={[a.font_bold, t.atoms.text_contrast_medium, a.px_md]}>
+        theme.atoms.text_contrast_medium
       </Text>
 
-      <View style={[a.flex_1, t.atoms.border, a.border_t]} />
-      <Text style={[a.font_bold, t.atoms.text_contrast_400, a.px_md]}>
-        theme.atoms.text_contrast_400
+      <View style={[a.flex_1, t.atoms.border_contrast_low, a.border_t]} />
+      <Text style={[a.font_bold, t.atoms.text_contrast_low, a.px_md]}>
+        theme.atoms.text_contrast_low
       </Text>
 
-      <View style={[a.flex_1, t.atoms.border_contrast, a.border_t]} />
+      <View style={[a.flex_1, t.atoms.border_contrast_low, a.border_t]} />
 
       <View style={[a.w_full, a.gap_md]}>
         <View style={[t.atoms.bg, a.justify_center, a.p_md]}>
diff --git a/src/view/screens/Storybook/Typography.tsx b/src/view/screens/Storybook/Typography.tsx
index ecd6ec888..1aa334ac2 100644
--- a/src/view/screens/Storybook/Typography.tsx
+++ b/src/view/screens/Storybook/Typography.tsx
@@ -2,20 +2,12 @@ import React from 'react'
 import {View} from 'react-native'
 
 import {atoms as a} from '#/alf'
-import {Text, H1, H2, H3, H4, H5, H6, P} from '#/components/Typography'
+import {Text} from '#/components/Typography'
 import {RichText} from '#/components/RichText'
 
 export function Typography() {
   return (
     <View style={[a.gap_md]}>
-      <H1>H1 Heading</H1>
-      <H2>H2 Heading</H2>
-      <H3>H3 Heading</H3>
-      <H4>H4 Heading</H4>
-      <H5>H5 Heading</H5>
-      <H6>H6 Heading</H6>
-      <P>P Paragraph</P>
-
       <Text style={[a.text_5xl]}>atoms.text_5xl</Text>
       <Text style={[a.text_4xl]}>atoms.text_4xl</Text>
       <Text style={[a.text_3xl]}>atoms.text_3xl</Text>