# createElement

```ts
import { createElement, Rectangle } from "@pibbl/core";
```

`createElement(type, props, ...children)` constructs the branded [`PibblElement`](/reference/types/elements-components/#pibblelement) explicit equivalent of Pibbl
JSX. Its `type` is a [`PibblElementType`](/reference/types/elements-components/#pibblelementtype); `props` can be `null`; variadic [`PibblNode`](/reference/types/elements-components/#pibblnode) children override `props.children`, while
zero variadic children preserve it. `key` accepts a [`PibblKey`](/reference/types/elements-components/#pibblkey), is normalized, and is not delivered to props.

```ts
const scene = createElement(Rectangle, {
  style: { width: 160, height: 80, fill: "#2563eb" },
});
```

Try [Authoring without JSX](/guides/author-without-jsx/).

## API details from source

<span id="api-createElement"></span>

Public constructor used by direct element authoring.

```ts
createElement: <P>(type: PibblElementType<P>, props: ElementInputOrNull<P>, ...children: ChildrenArguments<P>) => PibblElement<P>
```

Related API: [createElement](/reference/functions/create-element/), [PibblElementType](/reference/types/elements-components/#pibblelementtype), [PibblElement](/reference/types/elements-components/#pibblelement).

### Parameters

- **`type`** — Pibbl component or fragment to instantiate. See [PibblElementType](/reference/types/elements-components/#pibblelementtype).

- **`props`** — Authored props, or null when allowed by the component's input type. See
`ElementInputOrNull` .

- **`children`** — Child nodes supplied in source order. See `ChildrenArguments`.

### Returns

A branded Pibbl element descriptor; rendering occurs when it is mounted. See
[PibblElement](/reference/types/elements-components/#pibblelement) .

### See also

[PibblElementType](/reference/types/elements-components/#pibblelementtype)

[PibblElement](/reference/types/elements-components/#pibblelement)

[View source — packages/core/src/lib/element/create-element.ts:58](/source/packages/core/src/lib/element/create-element-ts/#L58)

## Implementation guidance for agents

Read the [Authoring, signals, and lifecycle companion](/agents/topics/lifecycle/) for ownership, adaptation, failure modes, and verification. [Agent start](/agents/) provides the version-selection workflow.

## Complete minimal examples

- [Typed components and recursive children](/minimal-examples/lifecycle/elements/): Build a component with createElement, group its children in a Fragment, and render textual children. [Plain source](/minimal/lifecycle/elements.tsx)
## Documentation version

Documentation built with @pibbl/core 0.0.2, revision 272a94a. ALPHA — NOT FOR PRODUCTION USE.