diff --git a/docs/components/input.md b/docs/components/input.md
index 115e962423..9bff631882 100644
--- a/docs/components/input.md
+++ b/docs/components/input.md
@@ -54,6 +54,18 @@ Use the `pill` attribute to give inputs rounded edges.
```
+### Input Types
+
+The `type` attribute controls the type of input the browser renders.
+
+```html preview
+
+
+
+
+
+```
+
### Disabled
Use the `disabled` attribute to disable an input.
diff --git a/docs/resources/changelog.md b/docs/resources/changelog.md
index e84043d96f..49ccdb194c 100644
--- a/docs/resources/changelog.md
+++ b/docs/resources/changelog.md
@@ -9,6 +9,7 @@ _During the beta period, these restrictions may be relaxed in the event of a mis
## Next
- Added `--swatch-size` custom property to `sl-color-picker`
+- Added `date` to `sl-input` as a supported `type`
- Adjusted elevation tokens to use neutral in light mode and black in dark mode
- Adjusted `--sl-overlay-background-color` in dark theme to be black instead of gray
- Fixed a bug in `sl-color-picker` where the opacity slider wasn't showing the current color
diff --git a/src/components/input/input.ts b/src/components/input/input.ts
index 248fd6b554..3dda3ba02d 100644
--- a/src/components/input/input.ts
+++ b/src/components/input/input.ts
@@ -61,7 +61,8 @@ export default class SlInput extends LitElement {
@state() private isPasswordVisible = false;
/** The input's type. */
- @property({ reflect: true }) type: 'email' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'url' = 'text';
+ @property({ reflect: true }) type: 'date' | 'email' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'url' =
+ 'text';
/** The input's size. */
@property({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';