--- a/devtools/client/inspector/fonts/components/FontsApp.js
+++ b/devtools/client/inspector/fonts/components/FontsApp.js
@@ -14,41 +14,43 @@ const FontOverview = createFactory(requi
 
 const Types = require("../types");
 
 class FontsApp extends PureComponent {
   static get propTypes() {
     return {
       fontData: PropTypes.shape(Types.fontData).isRequired,
       fontEditor: PropTypes.shape(Types.fontEditor).isRequired,
+      fontEditorEnabled: PropTypes.bool.isRequired,
       fontOptions: PropTypes.shape(Types.fontOptions).isRequired,
       onInstanceChange: PropTypes.func.isRequired,
       onPreviewFonts: PropTypes.func.isRequired,
       onPropertyChange: PropTypes.func.isRequired,
       onToggleFontHighlight: PropTypes.func.isRequired,
     };
   }
 
   render() {
     const {
       fontData,
       fontEditor,
+      fontEditorEnabled,
       fontOptions,
       onInstanceChange,
       onPreviewFonts,
       onPropertyChange,
       onToggleFontHighlight,
     } = this.props;
 
     return dom.div(
       {
         className: "theme-sidebar inspector-tabpanel",
         id: "sidebar-panel-fontinspector"
       },
-      FontEditor({
+      fontEditorEnabled && FontEditor({
         fontEditor,
         onInstanceChange,
         onPropertyChange,
         onToggleFontHighlight,
       }),
       FontOverview({
         fontData,
         fontOptions,

--- a/devtools/client/inspector/fonts/fonts.js
+++ b/devtools/client/inspector/fonts/fonts.js
@@ -88,16 +88,17 @@ class FontInspector {
   }
 
   init() {
     if (!this.inspector) {
       return;
     }
 
     const fontsApp = FontsApp({
+      fontEditorEnabled: Services.prefs.getBoolPref(PREF_FONT_EDITOR),
       onInstanceChange: this.onInstanceChange,
       onToggleFontHighlight: this.onToggleFontHighlight,
       onPreviewFonts: this.onPreviewFonts,
       onPropertyChange: this.onPropertyChange,
     });
 
     const provider = createElement(Provider, {
       id: "fontinspector",