Title

Title adds a <title> element that sets the document title.

Import

import { Title } from "@solidjs/meta";

Type

const Title: Component<JSX.HTMLAttributes<HTMLTitleElement> & { key?: string }>;

Props

children

• Type: JSX.Element
• Optional: Yes

Text content of the title element. Applied via textContent, so it is always escaped. Can be a reactive expression.

key

• Type: string
• Optional: Yes

Overrides the default identity used for deduplication.

Behavior

• title is a hard singleton: the last-registered <Title> wins regardless of attributes.
• Unmounting the winning <Title> restores the previous one; a static <title> in your server shell is the final fallback.

Examples

Basic usage

import { Title } from "@solidjs/meta";

export default function Page() {
  return <Title>Solid Docs</Title>;
}

Reactive title

import { Title } from "@solidjs/meta";

export default function Product(props: { name: () => string }) {
  return <Title>{props.name()} | My Store</Title>;
}

Related

• Meta
• Head