diff --git a/CHANGELOG.md b/CHANGELOG.md
index 52a8f079..559eec76 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -8,6 +8,7 @@
 
 ### 🎨 Enhancements
 
+- [#441](https://github.com/estruyf/vscode-front-matter/issues/441): Show input descriptions for snippet and data forms
 - [#798](https://github.com/estruyf/vscode-front-matter/issues/798): Changed dialog to slide-over for the snippet forms
 - [#799](https://github.com/estruyf/vscode-front-matter/issues/799): Added `frontMatter.logging` setting to define the logging output. Options are `info`, `warn`, `error`, and `verbose`. Default is `info`.
 - [#800](https://github.com/estruyf/vscode-front-matter/issues/800): Add colors for the Front Matter CMS output
diff --git a/src/components/uniforms-frontmatter/BoolField.tsx b/src/components/uniforms-frontmatter/BoolField.tsx
index 08296e91..4b80dc1d 100644
--- a/src/components/uniforms-frontmatter/BoolField.tsx
+++ b/src/components/uniforms-frontmatter/BoolField.tsx
@@ -7,7 +7,7 @@ import { LabelField } from './LabelField';
 export type BoolFieldProps = HTMLFieldProps<
   boolean,
   HTMLDivElement,
-  { inputRef?: Ref<HTMLInputElement> }
+  { inputRef?: Ref<HTMLInputElement>, description?: string }
 >;
 
 function Bool({
@@ -37,6 +37,12 @@ function Bool({
         />
         <span className="field__toggle__slider"></span>
       </label>
+
+      {
+        props.description && (
+          <span className='block text-xs text-[var(--vscode--settings-headerForeground)] opacity-75 mt-2 mx-2'>{props.description}</span>
+        )
+      }
     </div>
   );
 }
diff --git a/src/components/uniforms-frontmatter/DateField.tsx b/src/components/uniforms-frontmatter/DateField.tsx
index 512536ec..a6fe36b2 100644
--- a/src/components/uniforms-frontmatter/DateField.tsx
+++ b/src/components/uniforms-frontmatter/DateField.tsx
@@ -9,7 +9,7 @@ const dateFormat = (value?: Date) => value?.toISOString().slice(0, -8);
 export type DateFieldProps = HTMLFieldProps<
   Date,
   HTMLDivElement,
-  { inputRef?: Ref<HTMLInputElement>; max?: Date; min?: Date }
+  { inputRef?: Ref<HTMLInputElement>; max?: Date; min?: Date, description?: string }
 >;
 
 function Date({
@@ -50,6 +50,12 @@ function Date({
         type="datetime-local"
         value={dateFormat(value) ?? ''}
       />
+
+      {
+        props.description && (
+          <span className='block text-xs text-[var(--vscode--settings-headerForeground)] opacity-75 mt-2 mx-2'>{props.description}</span>
+        )
+      }
     </div>
   );
 }
diff --git a/src/components/uniforms-frontmatter/LongTextField.tsx b/src/components/uniforms-frontmatter/LongTextField.tsx
index e8ee54fc..a36cf44c 100644
--- a/src/components/uniforms-frontmatter/LongTextField.tsx
+++ b/src/components/uniforms-frontmatter/LongTextField.tsx
@@ -6,7 +6,7 @@ import { LabelField } from './LabelField';
 export type LongTextFieldProps = HTMLFieldProps<
   string,
   HTMLDivElement,
-  { inputRef?: Ref<HTMLTextAreaElement> }
+  { inputRef?: Ref<HTMLTextAreaElement>, description?: string }
 >;
 
 function LongText({
@@ -36,6 +36,12 @@ function LongText({
         ref={inputRef}
         value={value ?? ''}
       />
+
+      {
+        props.description && (
+          <span className='block text-xs text-[var(--vscode--settings-headerForeground)] opacity-75 mt-2 mx-2'>{props.description}</span>
+        )
+      }
     </div>
   );
 }
diff --git a/src/components/uniforms-frontmatter/NumField.tsx b/src/components/uniforms-frontmatter/NumField.tsx
index e61aaeb4..09026e56 100644
--- a/src/components/uniforms-frontmatter/NumField.tsx
+++ b/src/components/uniforms-frontmatter/NumField.tsx
@@ -6,7 +6,7 @@ import { LabelField } from './LabelField';
 export type NumFieldProps = HTMLFieldProps<
   number,
   HTMLDivElement,
-  { decimal?: boolean; inputRef?: Ref<HTMLInputElement> }
+  { decimal?: boolean; inputRef?: Ref<HTMLInputElement>, description?: string }
 >;
 
 function Num({
@@ -47,6 +47,12 @@ function Num({
         type="number"
         value={value ?? ''}
       />
+
+      {
+        props.description && (
+          <span className='block text-xs text-[var(--vscode--settings-headerForeground)] opacity-75 mt-2 mx-2'>{props.description}</span>
+        )
+      }
     </div>
   );
 }
diff --git a/src/components/uniforms-frontmatter/TextField.tsx b/src/components/uniforms-frontmatter/TextField.tsx
index 90e35396..b67a59c3 100644
--- a/src/components/uniforms-frontmatter/TextField.tsx
+++ b/src/components/uniforms-frontmatter/TextField.tsx
@@ -6,7 +6,7 @@ import { LabelField } from './LabelField';
 export type TextFieldProps = HTMLFieldProps<
   string,
   HTMLDivElement,
-  { inputRef?: Ref<HTMLInputElement> }
+  { inputRef?: Ref<HTMLInputElement>, description?: string }
 >;
 
 function Text({
@@ -40,6 +40,12 @@ function Text({
         type={type}
         value={value ?? ''}
       />
+
+      {
+        props.description && (
+          <span className='block text-xs text-[var(--vscode--settings-headerForeground)] opacity-75 mt-2 mx-2'>{props.description}</span>
+        )
+      }
     </div>
   );
 }
diff --git a/src/components/uniforms-frontmatter/UnknownField.tsx b/src/components/uniforms-frontmatter/UnknownField.tsx
index 2d12836d..046e6ec4 100644
--- a/src/components/uniforms-frontmatter/UnknownField.tsx
+++ b/src/components/uniforms-frontmatter/UnknownField.tsx
@@ -8,7 +8,7 @@ import { LocalizationKey } from '../../localization';
 export type UnknownFieldProps = HTMLFieldProps<
   string,
   HTMLDivElement,
-  { inputRef?: Ref<HTMLInputElement> }
+  { inputRef?: Ref<HTMLInputElement>, description?: string }
 >;
 
 function UnknownField({
@@ -30,6 +30,12 @@ function UnknownField({
       <LabelField label={label} id={id} required={props.required} />
 
       <div className={`text-[var(--vscode-errorForeground)]`}>{l10n.t(LocalizationKey.fieldUnknown)}</div>
+
+      {
+        props.description && (
+          <span className='block text-xs text-[var(--vscode--settings-headerForeground)] opacity-75 mt-2 mx-2'>{props.description}</span>
+        )
+      }
     </div>
   );
 }
diff --git a/src/dashboardWebView/components/Common/TextField.tsx b/src/dashboardWebView/components/Common/TextField.tsx
index bfaaec9a..8d9a90d7 100644
--- a/src/dashboardWebView/components/Common/TextField.tsx
+++ b/src/dashboardWebView/components/Common/TextField.tsx
@@ -5,6 +5,7 @@ export interface ITextFieldProps {
   name: string;
   value?: string;
   placeholder?: string;
+  description?: string;
   icon?: JSX.Element;
   disabled?: boolean;
   autoFocus?: boolean;
@@ -18,6 +19,7 @@ export const TextField: React.FunctionComponent<ITextFieldProps> = ({
   name,
   value,
   placeholder,
+  description,
   icon,
   autoFocus,
   multiline,
@@ -27,52 +29,63 @@ export const TextField: React.FunctionComponent<ITextFieldProps> = ({
   onReset
 }: React.PropsWithChildren<ITextFieldProps>) => {
   return (
-    <div className="relative flex justify-center">
-      {
-        icon && (
-          <div className="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
-            {icon}
-          </div>
-        )
-      }
+    <>
+
+      <div className="relative flex justify-center">
+        {
+          icon && (
+            <div className="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
+              {icon}
+            </div>
+          )
+        }
+
+        {
+          multiline ? (
+            <textarea
+              rows={rows || 3}
+              name={name}
+              className={`block w-full py-2 ${icon ? "pl-10" : "pl-2"} pr-2 sm:text-sm appearance-none disabled:opacity-50 rounded bg-[var(--vscode-input-background)] text-[var(--vscode-input-foreground)] placeholder-[var(--vscode-input-placeholderForeground)] border-[var(--frontmatter-border)] focus:border-[var(--vscode-focusBorder)] focus:outline-0`}
+              style={{
+                boxShadow: "none"
+              }}
+              placeholder={placeholder || ""}
+              value={value}
+              autoFocus={!!autoFocus}
+              onChange={(e) => onChange && onChange(e.target.value)}
+              disabled={!!disabled}
+            />
+          ) : (
+            <input
+              type="text"
+              name={name}
+              className={`block w-full py-2 ${icon ? "pl-10" : "pl-2"} pr-2 sm:text-sm appearance-none disabled:opacity-50 rounded bg-[var(--vscode-input-background)] text-[var(--vscode-input-foreground)] placeholder-[var(--vscode-input-placeholderForeground)] border-[var(--frontmatter-border)] focus:border-[var(--vscode-focusBorder)] focus:outline-0`}
+              style={{
+                boxShadow: "none"
+              }}
+              placeholder={placeholder || ""}
+              value={value}
+              autoFocus={!!autoFocus}
+              onChange={(e) => onChange && onChange(e.target.value)}
+              disabled={!!disabled}
+            />
+          )
+        }
+
+        {(value && onReset) && (
+          <button onClick={onReset} className="absolute inset-y-0 right-0 pr-3 flex items-center text-[var(--vscode-input-foreground)] hover:text-[var(--vscode-textLink-activeForeground)]">
+            <XCircleIcon className={`h-5 w-5`} aria-hidden="true" />
+          </button>
+        )}
+      </div>
 
       {
-        multiline ? (
-          <textarea
-            rows={rows || 3}
-            name={name}
-            className={`block w-full py-2 ${icon ? "pl-10" : "pl-2"} pr-2 sm:text-sm appearance-none disabled:opacity-50 rounded bg-[var(--vscode-input-background)] text-[var(--vscode-input-foreground)] placeholder-[var(--vscode-input-placeholderForeground)] border-[var(--frontmatter-border)] focus:border-[var(--vscode-focusBorder)] focus:outline-0`}
-            style={{
-              boxShadow: "none"
-            }}
-            placeholder={placeholder || ""}
-            value={value}
-            autoFocus={!!autoFocus}
-            onChange={(e) => onChange && onChange(e.target.value)}
-            disabled={!!disabled}
-          />
-        ) : (
-          <input
-            type="text"
-            name={name}
-            className={`block w-full py-2 ${icon ? "pl-10" : "pl-2"} pr-2 sm:text-sm appearance-none disabled:opacity-50 rounded bg-[var(--vscode-input-background)] text-[var(--vscode-input-foreground)] placeholder-[var(--vscode-input-placeholderForeground)] border-[var(--frontmatter-border)] focus:border-[var(--vscode-focusBorder)] focus:outline-0`}
-            style={{
-              boxShadow: "none"
-            }}
-            placeholder={placeholder || ""}
-            value={value}
-            autoFocus={!!autoFocus}
-            onChange={(e) => onChange && onChange(e.target.value)}
-            disabled={!!disabled}
-          />
+        description && (
+          <p className="text-xs text-[var(--vscode--settings-headerForeground)] opacity-75 mt-2 mx-2">
+            {description}
+          </p>
         )
       }
-
-      {(value && onReset) && (
-        <button onClick={onReset} className="absolute inset-y-0 right-0 pr-3 flex items-center text-[var(--vscode-input-foreground)] hover:text-[var(--vscode-textLink-activeForeground)]">
-          <XCircleIcon className={`h-5 w-5`} aria-hidden="true" />
-        </button>
-      )}
-    </div>
+    </>
   );
 };
\ No newline at end of file
diff --git a/src/dashboardWebView/components/SnippetsView/SnippetForm.tsx b/src/dashboardWebView/components/SnippetsView/SnippetForm.tsx
index efd31fdd..05431ea0 100644
--- a/src/dashboardWebView/components/SnippetsView/SnippetForm.tsx
+++ b/src/dashboardWebView/components/SnippetsView/SnippetForm.tsx
@@ -199,7 +199,10 @@ ${snippetBody}
                   {field.title || field.name}
                 </label>
                 <div className="mt-1">
-                  <SnippetInputField field={field} fieldInfo={fieldInfo} onValueChange={onTextChange} />
+                  <SnippetInputField
+                    field={field}
+                    fieldInfo={fieldInfo}
+                    onValueChange={onTextChange} />
                 </div>
               </div>
             )
diff --git a/src/dashboardWebView/components/SnippetsView/SnippetInputField.tsx b/src/dashboardWebView/components/SnippetsView/SnippetInputField.tsx
index 16126f70..1135bcb2 100644
--- a/src/dashboardWebView/components/SnippetsView/SnippetInputField.tsx
+++ b/src/dashboardWebView/components/SnippetsView/SnippetInputField.tsx
@@ -27,31 +27,41 @@ export const SnippetInputField: React.FunctionComponent<ISnippetInputFieldProps>
 
   if (field.type === 'choice') {
     return (
-      <div className="relative">
-        <select
-          name={field.name}
-          value={field.value || ''}
-          className={`block w-full sm:text-sm pr-2 appearance-none disabled:opacity-50 rounded bg-[var(--vscode-input-background)] text-[var(--vscode-input-foreground)] placeholder-[var(--vscode-input-placeholderForeground)] border-[var(--frontmatter-border)] focus:border-[var(--vscode-focusBorder)] focus:outline-0`}
-          style={{
-            boxShadow: "none"
-          }}
-          onChange={(e) => onValueChange(field, e.target.value)}
-        >
-          {(field.choices || [])?.map((option: string | Choice, index: number) =>
-            typeof option === 'string' ? (
-              <option key={index} value={option}>
-                {option}
-              </option>
-            ) : (
-              <option key={index} value={option.id}>
-                {option.title}
-              </option>
-            )
-          )}
-        </select>
+      <>
+        <div className="relative">
+          <select
+            name={field.name}
+            value={field.value || ''}
+            className={`block w-full sm:text-sm pr-2 appearance-none disabled:opacity-50 rounded bg-[var(--vscode-input-background)] text-[var(--vscode-input-foreground)] placeholder-[var(--vscode-input-placeholderForeground)] border-[var(--frontmatter-border)] focus:border-[var(--vscode-focusBorder)] focus:outline-0`}
+            style={{
+              boxShadow: "none"
+            }}
+            onChange={(e) => onValueChange(field, e.target.value)}
+          >
+            {(field.choices || [])?.map((option: string | Choice, index: number) =>
+              typeof option === 'string' ? (
+                <option key={index} value={option}>
+                  {option}
+                </option>
+              ) : (
+                <option key={index} value={option.id}>
+                  {option.title}
+                </option>
+              )
+            )}
+          </select>
 
-        <ChevronDownIcon className="absolute top-3 right-2 w-4 h-4 text-gray-500" />
-      </div>
+          <ChevronDownIcon className="absolute top-3 right-2 w-4 h-4 text-gray-500" />
+        </div>
+
+        {
+          field.description && (
+            <p className="text-xs text-[var(--vscode--settings-headerForeground)] opacity-75 mt-2 mx-2">
+              {field.description}
+            </p>
+          )
+        }
+      </>
     );
   }
 
@@ -60,6 +70,7 @@ export const SnippetInputField: React.FunctionComponent<ISnippetInputFieldProps>
       <TextField
         name={field.name}
         value={field.value || ''}
+        description={field.description}
         onChange={(e) => onValueChange(field, e)}
         rows={4}
         multiline
@@ -71,6 +82,7 @@ export const SnippetInputField: React.FunctionComponent<ISnippetInputFieldProps>
     <TextField
       name={field.name}
       value={field.value || ''}
+      description={field.description}
       onChange={(e) => onValueChange(field, e)}
     />
   );