# Render a UI Builder design in your own page

> Show a saved design anywhere with the j-uibuilder web component and the address of its JSON file, with jComponent 20 as the only requirement.

Framework: uibuilder
Product: UI Builder (uibuilder@1)
Language: en
Content-SHA256: dd8955b5647235d035f7e4e657dfb7fb1aa72fb4a5f80311b92f060b7daec88e
Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c
Sources: 
Review: not-recorded

A design is a JSON file ([the format](/en/uibuilder/the-ui-json-format/)), and rendering it is one component. The README of the editor shows it with the web component [j-uibuilder](https://componentator.com/components/j-uibuilder/):

```html
<ui-component name="uibuilder" config="url:https://uibuilder.totaljs.com/render.json"></ui-component>
```

`config="url:..."` is the address of the JSON file of the design. The page needs jComponent 20 and the component `uibuilder`; the editor itself serves a ready page for this (`public/render.txt`) that loads jComponent from the CDN:

```html
<link href="https://cdn.componentator.com/spa.min@20.css" rel="stylesheet" type="text/css" />
<script src="https://cdn.componentator.com/spa.min@20.js"></script>
```

Then the design appears where you put the tag: a form, a dashboard, a board of a flow. Because the design is data, your application can decide which file to show per user or per customer.

## What the page of Forge already gives you

- The catalogue of components of Forge has the page [uibuilder](/en/components/uibuilder/), generated from the repository of the components, with its readme and example.
- In the editor, the component list that a design uses is the one in its `components` field; a design can only be rendered where those components can be reached.

## Good to know

- You do not need the editor to render: any page with jComponent 20 can do it.
- The runtime that renders a design is `cdn/uibuilder.min@1.js` in the repository of the editor.
- UI Studio, listed among the app templates of Total.js, builds on the same idea ([Total.js apps](https://www.totaljs.com/apps/)).
