diff --git a/packages/grafana-ui/src/components/Forms/TextArea/TextArea.tsx b/packages/grafana-ui/src/components/Forms/TextArea/TextArea.tsx
index 04e034f5655..d65f3ba0ecd 100644
--- a/packages/grafana-ui/src/components/Forms/TextArea/TextArea.tsx
+++ b/packages/grafana-ui/src/components/Forms/TextArea/TextArea.tsx
@@ -12,16 +12,18 @@ export interface Props extends Omit<HTMLProps<HTMLTextAreaElement>, 'size'> {
   size?: FormInputSize;
 }
 
-export const TextArea = React.forwardRef<HTMLTextAreaElement, Props>(({ invalid, size = 'auto', ...props }, ref) => {
-  const theme = useTheme();
-  const styles = getTextAreaStyle(theme, invalid);
+export const TextArea = React.forwardRef<HTMLTextAreaElement, Props>(
+  ({ invalid, size = 'auto', className, ...props }, ref) => {
+    const theme = useTheme();
+    const styles = getTextAreaStyle(theme, invalid);
 
-  return (
-    <div className={inputSizes()[size]}>
-      <textarea className={styles.textarea} {...props} ref={ref} />
-    </div>
-  );
-});
+    return (
+      <div className={inputSizes()[size]}>
+        <textarea {...props} className={cx(styles.textarea, className)} ref={ref} />
+      </div>
+    );
+  }
+);
 
 const getTextAreaStyle = stylesFactory((theme: GrafanaTheme, invalid = false) => {
   return {