---
# Scope:
# * TL;DR I want to run CKEditor 5.
category: builds-guides
order: 30
---
# Quick start
Creating an editor using a CKEditor 5 build is very simple and can be described in two steps:
1. Load the desired editor via the `
```
Call the {@link module:editor-classic/classiceditor~ClassicEditor#create `ClassicEditor.create()`} method.
```html
```
### Example
```html
CKEditor 5 – Classic editor
Classic editor
This is some sample content.
```
## Inline editor
In your HTML page add an element that CKEditor should make editable:
```html
```
Load the inline editor build (here [CDN](https://cdn.ckeditor.com/) location is used):
```html
```
Call the {@link module:editor-inline/inlineeditor~InlineEditor#create `InlineEditor.create()`} method.
```html
```
### Example
```html
CKEditor 5 - Inline editor
Inline editor
This is some sample content.
```
## Balloon editor
In your HTML page add an element that CKEditor should make editable:
```html
```
Load the balloon editor build (here [CDN](https://cdn.ckeditor.com/) location is used):
```html
```
Call the {@link module:editor-balloon/ballooneditor~BalloonEditor#create `BalloonEditor.create()`} method.
```html
```
### Example
```html
CKEditor 5 – Balloon editor
Balloon editor
This is some sample content.
```
## Balloon block editor
In your HTML page add an element that CKEditor should make editable:
```html
```
Load the balloon block editor build (here [CDN](https://cdn.ckeditor.com/) location is used):
```html
```
Call the {@link module:editor-balloon/ballooneditor~BalloonEditor#create `BalloonEditor.create()`} method.
```html
```
**Note:** You can configure the block toolbar items using the {@link module:core/editor/editorconfig~EditorConfig#blockToolbar `config.blockToolbar`} option.
### Example
```html
CKEditor 5 – Balloon block editor
Balloon editor
This is some sample content.
```
## Document editor
Load the document editor build (here [CDN](https://cdn.ckeditor.com/) location is used):
```html
```
Call the {@link module:editor-decoupled/decouplededitor~DecoupledEditor.create `DecoupledEditor.create()`} method. The decoupled editor requires you to inject the toolbar into the DOM and the best place to do that is somewhere in the promise chain (e.g. one of the `then( () => { ... } )` blocks).
The following snippet will run the document editor but to make the most of it check out the {@link framework/guides/document-editor comprehensive tutorial} which explains step—by—step how to configure and style the application for the best editing experience.
```html
```
### Example
```html
CKEditor 5 – Document editor
Document editor
This is the initial editor content.
```
## Next steps
Check the {@link builds/guides/integration/configuration Configuration guide} to learn how to configure the editor — for example, change the default toolbar.