---
title: Get started with headless Optimizely Forms
slug: cms-12/docs/get-started-with-headless-optimizely-forms
docTags: 
createdAt: 2026-08-10T15:56:02.000Z
---

Install the headless Optimizely Forms package to leverage functionality and features.

## Headless architecture

Headless Forms and CMS is one possible head a customer can use as a management site that serves and processes data. Optimizely also provides the headless JavaScript SDK or react as a starter kit to build a frontend site to deliver data and UI that works in decoupled scenarios.

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/AKhFfPjpdLSSMJhL1MTgX-20260722-170225.png)

## Optimizely.Cms.Forms.Service

`Optimizely.Cms.Forms.Service` provides a built-in set of APIs to fulfill a complete flow of forms, including Get Forms structure or data, submit, and get- or list-submitted data.

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/pe4TpJsAqIQiVs5GvVI61-20260722-170225.png)

## Optimizely.Cms.Forms.ContentGraph

`Optimizely.Cms.Forms.ContentGraph` and Optimizely Graph let the search system index the form data into a specialized property in a schema. Site customers have a single experience working with an Optimizely Graph query to get data, including Forms in the query result.

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/le2RfuwqbW_hTrDlRECs9_80a34f90d9cbaf6828635d50f7dfefa851c7384f06e82c0ee5fa1edc54ab6cb2-form-headless-image.png)

JS SDK has 2 main components:

- **Form SDK** – Definitions of models, form container, element block, and validator models.
- **Form React SDK** – React components are elements (`TextboxElementBlock.tsx`, `TextareaElementBlock.tsx`, and so on) and forms (`Form.tsx`, `FormContainerBlock.tsx`) that receive form metadata to render forms, input, select, textarea, and so on, as HTML

Optimizely Graph query and React component options work with returned Optimizely Graph data.