diff --git a/README.md b/README.md
index 5d2b0e27..721406f1 100644
--- a/README.md
+++ b/README.md
@@ -166,6 +166,52 @@ class SomeOtherComponent extends React.Component {
 ```
 
 
+##### React Hooks/ES6 with Refs
+
+```javascript
+// 1. Import the functions
+import { disableBodyScroll, enableBodyScroll, clearAllBodyScrollLocks } from 'body-scroll-lock';
+
+const SomeComponent = () => {
+  // 2. Initialise your state and ref here
+  const [open, setOpen] = useState(false)
+  const ref = useRef(null)
+  
+  useEffect(() => {
+    // 3. Check for the target element that you want to persist scrolling for (such as a modal/lightbox/flyout/nav).
+    // Specifically, the target element is the one we would like to allow scroll on (NOT a parent of that element).
+    // This is also the element to apply the CSS '-webkit-overflow-scrolling: touch;' if desired.
+    
+    if (ref.current) {
+      if (open) {   
+        // 4. Disable body scroll when open
+        disabledBodyScrollLock(ref.current)
+      } else {
+        // 5. Re-enable body scroll when closed
+        enableBodyScrollLock(ref.current)
+      }
+    }
+
+    return () => {
+      // 5. Useful if we have called disableBodyScroll for multiple target elements,
+      // and we just want a kill-switch to undo all that.
+      // OR useful for if the `hideTargetElement()` function got circumvented eg. visitor
+      // clicks a link which takes him/her to a different page within the app.
+      clearAllBodyScrollLocks() 
+    }
+  }, [open])
+  
+  // 6. Pass your ref to SomeOtherComponent
+  return (
+      <SomeOtherComponent ref={ref}>
+        {/* some JSX to go here */}
+      </SomeOtherComponent>
+    );
+  }
+}
+```
+
+
 ##### Angular
 
 ```javascript