diff --git a/packages/grafana-ui/src/components/TextArea/TextArea.mdx b/packages/grafana-ui/src/components/TextArea/TextArea.mdx
index e31487cacd0..42e2344ec22 100644
--- a/packages/grafana-ui/src/components/TextArea/TextArea.mdx
+++ b/packages/grafana-ui/src/components/TextArea/TextArea.mdx
@@ -4,4 +4,26 @@ import { TextArea } from './TextArea';
 # TextArea
 Use for multi line inputs like descriptions.
 
+### Usage
+
+```jsx
+<TextArea invalid={invalid} placeholder={placeholder} cols={cols} disabled={disabled} />
+```
+
+### Usage in forms with Field
+
+`TextArea` should be used with the `Field` component to get labels and descriptions. It should also be used for validation. See the `Field` component for more information.
+
+```jsx
+<Field label="Important information" description="This information is very important, so you really need to fill it in">
+  <Textarea name="importantTextarea" required />
+</Field>
+```
+
+<Preview>
+  <Field label="Important information" description="This information is very important, so you really need to fill it in">
+    <Textarea name="importantTextarea" required />
+  </Field>
+</Preview>
+
 <Props of={TextArea} />