Skip to content

Predefined Templates

You can change the mode (light/dark) and the templates. Here you can find all the predefined templates.

javascript
 <OrgChartReact
    nodeBinding={{ field_0: "name", field_1: "title" }}
    style={{ width: "100%", height: "100%" }}
    mode="dark"
    template="olivia"
    data={[
      { id: 1, name: "Amber McKenzie", title: "CEO", img: "https://cdn.balkan.app/shared/empty-img-none.svg" },
      { id: 2, pid: 1, name: "Ava Field", title: "IT Manager", img: "https://cdn.balkan.app/shared/empty-img-none.svg" },
      { id: 3, pid: 1, name: "Rhys Harper", img: "https://cdn.balkan.app/shared/empty-img-none.svg" }
    ]}
  >
  </OrgChartReact>

Mode and Template Code Example