diff --git a/packages/preact/index.mts b/packages/preact/index.mts
index adc1cbb4..f0da196e 100644
--- a/packages/preact/index.mts
+++ b/packages/preact/index.mts
@@ -1,4 +1,4 @@
-import { VNode, createElement, ComponentChildren } from 'preact';
+import { JSX, VNode, createElement } from 'preact';
 import { render } from 'preact-render-to-string';
 import * as rulesPrerender from 'rules_prerender';
 
@@ -49,10 +49,13 @@ export function inlineStyle(importPath: string, meta: ImportMeta): VNode {
     return createElement('rules_prerender:annotation', {}, [ annotation ]);
 }
 
+interface TemplateProps extends JSX.HTMLAttributes<HTMLTemplateElement> {
+    shadowroot?: ShadowRootMode;
+}
+
 /** A component representing the native HTML `<template />` tag. */
-export function Template({ children, ...attrs }: {
-    children?: ComponentChildren,
-    [attr: string]: unknown,
-} = {}): VNode {
-    return createElement('template', { children, ...attrs });
+export function Template({ children, ...attrs }: TemplateProps = {}): VNode {
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-ignore JSX types are weird AF.
+    return createElement('template', attrs, children);
 }
diff --git a/packages/preact/index_test.mts b/packages/preact/index_test.mts
index 10e78d30..8f57a1d9 100644
--- a/packages/preact/index_test.mts
+++ b/packages/preact/index_test.mts
@@ -69,7 +69,6 @@ describe('preact', () => {
     describe('Template', () => {
         it('renders a `<template />` element', () => {
             const html = render(Template({
-                shadowroot: 'open',
                 children: [
                     createElement('div', {}, [
                         'Hello, World!',
@@ -77,8 +76,31 @@ describe('preact', () => {
                 ],
             }));
 
-            expect(html).toContain('<template shadowroot="open">');
+            expect(html).toContain('<template>');
             expect(html).toContain('<div>Hello, World!</div>');
         });
+
+        it('accepts `shadowroot`', () => {
+            const html = render(Template({ shadowroot: 'open' }));
+
+            expect(html).toContain('<template shadowroot="open">');
+        });
+
+        it('allows other HTML attributes', () => {
+            const html = render(Template({ id: 'my-template' }));
+
+            expect(html).toContain('<template id="my-template">');
+        });
+
+        it('restricts `shadowroot` type', () => {
+            // @ts-expect-error Wrong shadow root module.
+            expect(() => Template({ shadowroot: 'not-a-shadowroot-mode' }))
+                .not.toThrow();
+        });
+
+        it('disallows unknown attributes', () => {
+            // @ts-expect-error Unknown attribute.
+            expect(() => Template({ notAnAttribute: 'test' })).not.toThrow();
+        });
     });
 });