diff --git a/src/style.js b/src/style.js
index 0a4f916d..5896f79a 100644
--- a/src/style.js
+++ b/src/style.js
@@ -1,12 +1,19 @@
-import { useLayoutEffect, useContext } from 'react'
-import { StyleSheetContext } from './stylesheet-registry'
+import { useLayoutEffect } from 'react'
+import { useStyleRegistry } from './stylesheet-registry'
 import { computeId } from './lib/hash'
 export default function JSXStyle(props) {
-  const registry = useContext(StyleSheetContext)
+  const registry = useStyleRegistry()
+
+  // If `registry` does not exist, we do nothing here.
+  if (!registry) {
+    return null
+  }
+
   if (typeof window === 'undefined') {
     registry.add(props)
     return null
   }
+
   useLayoutEffect(() => {
     registry.add(props)
     return () => {
@@ -14,6 +21,7 @@ export default function JSXStyle(props) {
     }
     // props.children can be string[], will be striped since id is identical
   }, [props.id, String(props.dynamic)])
+
   return null
 }