# Solid Meta 0 29 0
> Manages document head tags in SolidJS applications with @solidjs/meta v0.29, providing SSR-ready Document Head management including Title, Meta, Link, Style, Base, and Stylesheet components with MetaProvider. Use when building SolidJS applications requiring dynamic head tag control, SEO meta tags, or managing document title/stylesheets across routes.
- Skill: `tangledgroup/solid-meta-0-29-0` (Agent Skill, multi-file: 3 files)
- Install (CLI): `npx skillmds@latest add tangledgroup/solid-meta-0-29-0`
- Raw SKILL.md: https://api.skillmd.com/api/skills/tangledgroup/solid-meta-0-29-0/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Marketing & Growth
- License: MIT
- Author: tangledgroup (https://skillmd.com/u/tangledgroup)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/tangledgroup/solid-meta-0-29-0
---
# @solidjs/meta v0.29
## Overview
Asynchronous SSR-ready Document Head management for SolidJS. Based on [react-head](https://github.com/tizmagik/react-head), it allows defining `document.head` tags anywhere in the component hierarchy — similar to react-helmet but built for SolidJS's fine-grained reactivity model.
Provides six head tag components (`Title`, `Meta`, `Link`, `Style`, `Base`, `Stylesheet`) and a single context provider (`MetaProvider`). On the server, tags are collected via Solid's `useAssets` API and injected into ``. On the client, server-generated tags (marked with `data-sm`) are removed in favor of client-rendered tags.
## When to Use
- Setting dynamic page titles in a SolidJS SPA or SSR application
- Managing SEO meta tags (`og:`, `twitter:`, description, canonical URLs)
- Injecting stylesheets or inline `
```
### Base Tag
```tsx
```
### Lazy-Loaded Route Components
Head tags in lazy-loaded components work correctly with Solid's async loading:
```tsx
import { lazy } from "solid-js";
import { Show } from "solid-js/web";
import { MetaProvider, Title } from "@solidjs/meta";
const Comp1 = lazy(async () => import("./Comp1"));
const Comp2 = lazy(async () => import("./Comp2"));
function App() {
const [show, setShow] = createSignal(true);
return (
Default
}>
);
}
```
## Advanced Topics
**Component API**: Full reference for all components, context, hooks, and types → [Component API](reference/01-component-api.md)
**SSR Patterns**: Cascading internals, XSS protection, hydration behavior, Googlebot compatibility, performance, behavioral guidelines → [SSR Patterns](reference/02-ssr-patterns.md)