diff --git a/src/lib/editor.component.html b/src/lib/editor.component.html
index ec5d0f36..a40d5d31 100644
--- a/src/lib/editor.component.html
+++ b/src/lib/editor.component.html
@@ -3,6 +3,7 @@
     [toolbar]="toolbar" 
     [editorView]="view"
     *ngIf="toolbar"
+    [disabled]="!editable"
   >
   </ngx-menu>
   <ngx-bubble></ngx-bubble>
diff --git a/src/lib/editor.component.scss b/src/lib/editor.component.scss
index 8e586d8a..27e1b722 100644
--- a/src/lib/editor.component.scss
+++ b/src/lib/editor.component.scss
@@ -41,6 +41,11 @@ $light-gray: #f1f1f1;
   }
 }
 
+.NgxEditor__Content--Disabled {
+  user-select: none;
+  pointer-events: none;
+}
+
 .NgxEditor__ImageWrapper {
   position: relative;
   display: inline-block;
diff --git a/src/lib/modules/menu/menu.component.html b/src/lib/modules/menu/menu.component.html
index afd75a06..1e8ad489 100644
--- a/src/lib/modules/menu/menu.component.html
+++ b/src/lib/modules/menu/menu.component.html
@@ -1,4 +1,4 @@
-<div class="NgxEditor__MenuBar">
+<div class="NgxEditor__MenuBar" [ngClass]="{'NgxEditor--Disabled': disabled}">
 
   <ng-container *ngFor="let toolbarItem of toolbar; let lastToolbarItem = last">
     <ng-container *ngFor="let item of toolbarItem; let lastItem = last">
diff --git a/src/lib/modules/menu/menu.component.ts b/src/lib/modules/menu/menu.component.ts
index e8bdf4c8..80dd21b4 100644
--- a/src/lib/modules/menu/menu.component.ts
+++ b/src/lib/modules/menu/menu.component.ts
@@ -16,6 +16,7 @@ import { SharedService } from '../../services/shared/shared.service';
 export class MenuComponent implements OnDestroy {
   @Input() toolbar: any;
   @Input() editorView: EditorView;
+  @Input() disabled = false;
 
   customMenuRef: TemplateRef<any> = null;
   customMenuRefSubscription: Subscription;
diff --git a/src/plugins/editable.ts b/src/plugins/editable.ts
index 3b86c21f..83977752 100644
--- a/src/plugins/editable.ts
+++ b/src/plugins/editable.ts
@@ -14,6 +14,17 @@ const editablePlugin = (editable = true) => {
     props: {
       editable(state: EditorState): boolean {
         return this.getState(state);
+      },
+      attributes(state: EditorState): Record<string, string> | null {
+        const isEnabled = this.getState(state);
+
+        if (isEnabled) {
+          return null;
+        }
+
+        return {
+          class: 'NgxEditor__Content--Disabled'
+        };
       }
     }
   });