{
  "id": "32adf210b78c50886d413da8",
  "source": "solid:signals",
  "type": "github-document",
  "title": "dynamic",
  "content": "---\ntitle: \u003cDynamic\u003e\norder: 5\nuse_cases: \u003e-\n  dynamic components, conditional rendering, polymorphic components, runtime\n  component selection, flexible ui, component switching\ntags:\n  - dynamic\n  - components\n  - jsx\n  - polymorphic\n  - rendering\n  - conditional\nversion: '1.0'\ndescription: \u003e-\n  Render components dynamically at runtime with the Dynamic component. Perfect\n  for polymorphic components and conditional component rendering.\n---\n\nThis component lets you insert an arbitrary Component or tag and passes the props through to it.\n\n```tsx\nimport { Dynamic } from \"solid-js/web\"\nimport type { JSX } from \"solid-js\"\n\nfunction Dynamic\u003cT\u003e(\n\tprops: T \u0026 {\n\t\tchildren?: any\n\t\tcomponent?: Component\u003cT\u003e | string | keyof JSX.IntrinsicElements\n\t}\n): () =\u003e JSX.Element\n```\n\nHere's an example of how you can use it:\n\n```tsx\n\u003cDynamic component={MyComponent} someProp={state.something} /\u003e\n```\n\n## Props\n\n| Name        | Type                                                        | Description                               |\n| :---------- | :---------------------------------------------------------- | :---------------------------------------- |\n| `component` | `Component\u003cT\u003e` \\| `string` \\| `keyof JSX.IntrinsicElements` | The component to render.                  |\n| `children`  | `any`                                                       | The children to pass to the component.    |\n| `...`       | `T`                                                         | Any other props to pass to the component. |",
  "url": "https://github.com/solidjs/solid-docs/blob/HEAD/src/routes/reference/components/dynamic.mdx",
  "metadata": {
    "path": "src/routes/reference/components/dynamic.mdx",
    "repo": "solidjs/solid-docs",
    "repo_url": "https://github.com/solidjs/solid-docs.git",
    "size": 1510,
    "source_type": "github"
  },
  "hash": "4c234ef649a66d638dffb352ddf993cabf14553245b376ed2d18ee5e17c94744",
  "timestamp": "2026-02-23T11:43:00.188935873+01:00"
}