{
  "id": "2cc7f00810938f542dc05a19",
  "source": "solid:signals",
  "type": "github-document",
  "title": "attr",
  "content": "---\ntitle: 'attr:*'\nuse_cases: \u003e-\n  web components, custom elements, forcing attributes, html attributes, dom\n  properties\ntags:\n  - attributes\n  - web-components\n  - dom\n  - props\n  - typescript\n  - custom-elements\nversion: '1.0'\ndescription: \u003e-\n  Force props as HTML attributes instead of properties in SolidJS. Essential for\n  Web Components and custom element attribute handling.\n---\n\nForces the prop to be treated as an attribute instead of a property.\nUseful for Web Components where you want to set attributes.\n\n```tsx\n\u003cmy-element attr:status={props.status} /\u003e\n```\n\n:::note[Strong-Typing Custom Attributes]\nType definitions are required when using TypeScript.\nSee the[TypeScript](/configuration/typescript#forcing-properties-and-custom-attributes) page for examples.\n:::",
  "url": "https://github.com/solidjs/solid-docs/blob/HEAD/src/routes/reference/jsx-attributes/attr.mdx",
  "metadata": {
    "path": "src/routes/reference/jsx-attributes/attr.mdx",
    "repo": "solidjs/solid-docs",
    "repo_url": "https://github.com/solidjs/solid-docs.git",
    "size": 778,
    "source_type": "github"
  },
  "hash": "0ae1a7028412b7cd5661a55b6761037d521789384e07cc0d698e6201e4671353",
  "timestamp": "2026-02-23T11:43:00.18930133+01:00"
}