diff --git a/.changeset/legal-points-glow.md b/.changeset/legal-points-glow.md
new file mode 100644
index 0000000..27bfa71
--- /dev/null
+++ b/.changeset/legal-points-glow.md
@@ -0,0 +1,5 @@
+---
+"notion-to-jsx": patch
+---
+
+Update text color to use theme variable in List and Quote components
diff --git a/packages/notion-to-jsx/src/components/Renderer/components/List/styles.css.ts b/packages/notion-to-jsx/src/components/Renderer/components/List/styles.css.ts
index 3ae3d6f..59bf973 100644
--- a/packages/notion-to-jsx/src/components/Renderer/components/List/styles.css.ts
+++ b/packages/notion-to-jsx/src/components/Renderer/components/List/styles.css.ts
@@ -6,6 +6,7 @@ export const list = recipe({
   base: {
     padding: `${vars.spacing.xs} ${vars.spacing.xxs}`,
     paddingLeft: vars.spacing.lg,
+    color: vars.colors.text,
   },
   variants: {
     type: {
diff --git a/packages/notion-to-jsx/src/components/Renderer/components/Quote/styles.css.ts b/packages/notion-to-jsx/src/components/Renderer/components/Quote/styles.css.ts
index e509316..0853658 100644
--- a/packages/notion-to-jsx/src/components/Renderer/components/Quote/styles.css.ts
+++ b/packages/notion-to-jsx/src/components/Renderer/components/Quote/styles.css.ts
@@ -6,7 +6,7 @@ export const container = style({
   margin: `${vars.spacing.xs} 0`,
   padding: `${vars.spacing.xs} 0 ${vars.spacing.xs} 1rem`,
   borderLeft: '3px solid #e1e1e1',
-  color: '#37352f',
+  color: vars.colors.text,
   fontSize: vars.typography.fontSize.base,
   lineHeight: vars.typography.lineHeight.base,
   fontStyle: 'italic',