diff --git a/README.md b/README.md
index 6ec82b3..bb34692 100644
--- a/README.md
+++ b/README.md
@@ -39,8 +39,15 @@ Make sure you're on a supported version of React and React DOM:
```sh
npm i react@^16.9 react-dom@^16.9
+
+# or use the latest and greatest react
+npm i react react-dom
```
+### Using Preact?
+
+PCR seamlessly integrates with Preact :sunglasses:, you don't even need to include `preact/compat`!
+
## Basic Usage
PCR components are easy to use and require no additional setup. Use as controlled or uncontrolled, use with hooks or with classes, and pass all the props you want -- it's all forwarded to the underlying `input` element. Hungry for more? Head on over the the [doc site](https://pretty-checkbox-react.netlify.app/).
diff --git a/docs/docs/usage/preact.md b/docs/docs/usage/preact.md
new file mode 100644
index 0000000..41632ad
--- /dev/null
+++ b/docs/docs/usage/preact.md
@@ -0,0 +1,57 @@
+---
+id: preact
+title: Preact
+---
+
+PCR works out of the box with Preact 10 due to the simplicity of the components. Literally can't get any easier :wink:.
+
+## Install
+
+```sh
+npx preact-cli preactjs-templates/simple preact_app
+cd preact_app
+npm i pretty-checkbox pretty-checkbox-react
+```
+
+## Usage
+
+From the `index.js` file in your Preact app:
+
+```jsx
+import { Checkbox, useCheckboxState } from 'pretty-checkbox-react';
+import '~/pretty-checkbox';
+
+export default function App() {
+ const checkbox = useCheckboxState();
+
+ return (
+ <>
+
Checked: {checkbox.state + ''}
+ > + ); +} +``` + +Wowza 🤯 so easy! + +### Usage with Hooks + +As per the Preact docs, we can use hooks from `preact/hooks` or from `preact/compat`: + +```jsx +import { useRef, useEffect } from 'preact/hooks'; +import { Checkbox } from 'pretty-checkbox-react'; + +import '~/pretty-checkbox'; + +export default function App() { + const ref = useRef(null); + + useEffect(() => { + console.log(ref); + }, []); + + return