diff --git a/docs/form.component.md b/docs/form.component.md
index f10022f069..51198dbc6a 100644
--- a/docs/form.component.md
+++ b/docs/form.component.md
@@ -238,6 +238,197 @@ also implement your own custom validators to replace or extend the set. See the
 
 ### Common scenarios
 
+#### Render form by using form definition JSON
+
+Below is a sample form definition JSON.
+
+```json
+    {
+            "id": 1001,
+            "name": "ISSUE_FORM",
+            "processDefinitionId": "ISSUE_APP:1:2504",
+            "processDefinitionName": "ISSUE_APP",
+            "processDefinitionKey": "ISSUE_APP",
+            "taskId": "2510",
+            "taskDefinitionKey": "sid-F67A2996-1684-4774-855A-4591490081FD",
+            "tabs": [],
+            "fields": [
+                {
+                    "fieldType": "ContainerRepresentation",
+                    "id": "1498212398417",
+                    "name": "Label",
+                    "type": "container",
+                    "value": null,
+                    "required": false,
+                    "readOnly": false,
+                    "overrideId": false,
+                    "colspan": 1,
+                    "placeholder": null,
+                    "minLength": 0,
+                    "maxLength": 0,
+                    "minValue": null,
+                    "maxValue": null,
+                    "regexPattern": null,
+                    "optionType": null,
+                    "hasEmptyValue": false,
+                    "options": null,
+                    "restUrl": null,
+                    "restResponsePath": null,
+                    "restIdProperty": null,
+                    "restLabelProperty": null,
+                    "tab": null,
+                    "className": null,
+                    "dateDisplayFormat": null,
+                    "sizeX": 2,
+                    "sizeY": 1,
+                    "row": -1,
+                    "col": -1,
+                    "numberOfColumns": 2,
+                    "fields": {
+                        "1": [
+                            {
+                                "fieldType": "RestFieldRepresentation",
+                                "id": "label",
+                                "name": "Label",
+                                "type": "dropdown",
+                                "value": "Choose one...",
+                                "required": false,
+                                "readOnly": false,
+                                "overrideId": false,
+                                "colspan": 1,
+                                "placeholder": null,
+                                "minLength": 0,
+                                "maxLength": 0,
+                                "minValue": null,
+                                "maxValue": null,
+                                "regexPattern": null,
+                                "optionType": null,
+                                "hasEmptyValue": true,
+                                "options": [
+                                    {
+                                        "id": "empty",
+                                        "name": "Choose one..."
+                                    },
+                                    {
+                                        "id": "option_1",
+                                        "name": "test1"
+                                    },
+                                    {
+                                        "id": "option_2",
+                                        "name": "test2"
+                                    },
+                                    {
+                                        "id": "option_3",
+                                        "name": "test3"
+                                    }
+                                ],
+                                "restUrl": null,
+                                "restResponsePath": null,
+                                "restIdProperty": null,
+                                "restLabelProperty": null,
+                                "tab": null,
+                                "className": null,
+                                "params": {
+                                    "existingColspan": 1,
+                                    "maxColspan": 2
+                                },
+                                "dateDisplayFormat": null,
+                                "layout": {
+                                    "row": -1,
+                                    "column": -1,
+                                    "colspan": 1
+                                },
+                                "sizeX": 1,
+                                "sizeY": 1,
+                                "row": -1,
+                                "col": -1,
+                                "visibilityCondition": null,
+                                "endpoint": null,
+                                "requestHeaders": null
+                            },
+                            {
+                                "fieldType": "FormFieldRepresentation",
+                                "id": "Date",
+                                "name": "Date",
+                                "type": "date",
+                                "value": null,
+                                "required": false,
+                                "readOnly": false,
+                                "overrideId": false,
+                                "colspan": 1,
+                                "placeholder": null,
+                                "minLength": 0,
+                                "maxLength": 0,
+                                "minValue": null,
+                                "maxValue": null,
+                                "regexPattern": null,
+                                "optionType": null,
+                                "hasEmptyValue": null,
+                                "options": null,
+                                "restUrl": null,
+                                "restResponsePath": null,
+                                "restIdProperty": null,
+                                "restLabelProperty": null,
+                                "tab": "tab1",
+                                "className": null,
+                                "params": {
+                                    "existingColspan": 1,
+                                    "maxColspan": 2
+                                },
+                                "dateDisplayFormat": null,
+                                "layout": {
+                                    "row": -1,
+                                    "column": -1,
+                                    "colspan": 1
+                                },
+                                "sizeX": 1,
+                                "sizeY": 1,
+                                "row": -1,
+                                "col": -1,
+                                "visibilityCondition": null
+                            }
+                        ]
+                    }
+                }
+            ],
+            "outcomes": [],
+            "javascriptEvents": [],
+            "className": "",
+            "style": "",
+            "customFieldTemplates": {},
+            "metadata": {},
+            "variables": [],
+            "customFieldsValueInfo": {},
+            "gridsterForm": false,
+            "globalDateFormat": "D-M-YYYY"
+        }
+```
+
+The component below with the form definition JSON assigned to the variable `formDefinitionJSON`, shows how a form is rendered by using form definition JSON.
+
+```ts
+@Component({
+    selector: 'sample-form',
+    template: `<div class="form-container">
+                    <adf-form
+                        [form]="form">
+                    </adf-form>
+                </div>`
+})
+export class SampleFormComponent implements OnInit {
+
+    form: FormModel;
+    formDefinitionJSON: any;
+
+    constructor(private formService: FormService) {
+    }
+
+    ngOnInit() {        
+        this.form = this.formService.parseForm(this.formDefinitionJSON);
+    }
+}
+```
+
 #### Changing field value based on another field
 
 Create a simple Form with a dropdown widget (id: `type`), and a multiline text (id: `description`).