diff --git a/src/editor/components/jgraduate/jQuery.jGraduate.js b/src/editor/components/jgraduate/jQuery.jGraduate.js
index 2a2362fe..738313c9 100644
--- a/src/editor/components/jgraduate/jQuery.jGraduate.js
+++ b/src/editor/components/jgraduate/jQuery.jGraduate.js
@@ -1,6 +1,7 @@
 /* eslint-disable no-loop-func */
 /* eslint-disable prefer-destructuring */
 /* eslint-disable no-unsanitized/property */
+/* globals svgEditor */
 /**
  * @file jGraduate 0.4
  *
@@ -234,109 +235,110 @@ export function jGraduateMethod (elem, options, okCallback, cancelCallback) {
     $this.paint = new jGraduate.Paint({ solidColor: 'ffffff' });
   }
   $this.classList.add('jGraduate_Picker');
-  /* eslint-disable max-len */
-  $this.innerHTML = '<ul class="jGraduate_tabs">' +
-      '<li class="jGraduate_tab_color jGraduate_tab_current" id="jGraduate_tab_color" data-type="col">Solid Color</li>' +
-      '<li class="jGraduate_tab_lingrad" id="jGraduate_tab_lingrad" data-type="lg">Linear Gradient</li>' +
-      '<li class="jGraduate_tab_radgrad" id="jGraduate_tab_radgrad" data-type="rg">Radial Gradient</li>' +
-    '</ul>' +
-    '<div class="jGraduate_colPick" id="jGraduate_colPick"></div>' +
-    '<div class="jGraduate_gradPick" id="jGraduate_gradPick"></div>' +
-    '<div class="jGraduate_LightBox" id="jGraduate_LightBox"></div>' +
-    '<div id="' + id + '_jGraduate_stopPicker" class="jGraduate_stopPicker"></div>';
+  // eslint-disable-next-line no-unsanitized/property
+  $this.innerHTML = `<ul class="jGraduate_tabs">
+      <li class="jGraduate_tab_color jGraduate_tab_current" id="jGraduate_tab_color" data-type="col">${svgEditor.i18next.t('config.jgraduate_solid_color')}</li>
+      <li class="jGraduate_tab_lingrad" id="jGraduate_tab_lingrad" data-type="lg">${svgEditor.i18next.t('config.jgraduate_linear_gradient')}</li>
+      <li class="jGraduate_tab_radgrad" id="jGraduate_tab_radgrad" data-type="rg">${svgEditor.i18next.t('config.jgraduate_radial_gradient')}</li>
+    </ul>
+    <div class="jGraduate_colPick" id="jGraduate_colPick"></div>
+    <div class="jGraduate_gradPick" id="jGraduate_gradPick"></div>
+    <div class="jGraduate_LightBox" id="jGraduate_LightBox"></div>
+    <div id="${id}_jGraduate_stopPicker" class="jGraduate_stopPicker"></div>`;
   /* JFH !!!! */
   const colPicker = $this.querySelector('#jGraduate_colPick');
   const gradPicker = $this.querySelector('#jGraduate_gradPick');
-  const html = '<div id="' + id + '_jGraduate_Swatch" class="jGraduate_Swatch">' +
-        '<h2 class="jGraduate_Title">' + $settings.window.pickerTitle + '</h2>' +
-        '<div id="' + id + '_jGraduate_GradContainer" class="jGraduate_GradContainer"></div>' +
-        '<div id="' + id + '_jGraduate_StopSlider" class="jGraduate_StopSlider"></div>' +
-      '</div>' +
-      '<div class="jGraduate_Form jGraduate_Points jGraduate_lg_field">' +
-        '<div class="jGraduate_StopSection">' +
-          '<label class="jGraduate_Form_Heading">Begin Point</label>' +
-          '<div class="jGraduate_Form_Section">' +
-            '<label>x:</label>' +
-            '<input type="text" id="' + id + '_jGraduate_x1" size="3" title="Enter starting x value between 0.0 and 1.0"/>' +
-            '<label>y:</label>' +
-            '<input type="text" id="' + id + '_jGraduate_y1" size="3" title="Enter starting y value between 0.0 and 1.0"/>' +
-          '</div>' +
-        '</div>' +
-        '<div class="jGraduate_StopSection">' +
-          '<label class="jGraduate_Form_Heading">End Point</label>' +
-          '<div class="jGraduate_Form_Section">' +
-            '<label>x:</label>' +
-            '<input type="text" id="' + id + '_jGraduate_x2" size="3" title="Enter ending x value between 0.0 and 1.0"/>' +
-            '<label>y:</label>' +
-            '<input type="text" id="' + id + '_jGraduate_y2" size="3" title="Enter ending y value between 0.0 and 1.0"/>' +
-          '</div>' +
-        '</div>' +
-      '</div>' +
-      '<div class="jGraduate_Form jGraduate_Points jGraduate_rg_field">' +
-        '<div class="jGraduate_StopSection">' +
-          '<label class="jGraduate_Form_Heading">Center Point</label>' +
-          '<div class="jGraduate_Form_Section">' +
-            '<label>x:</label>' +
-            '<input type="text" id="' + id + '_jGraduate_cx" size="3" title="Enter x value between 0.0 and 1.0"/>' +
-            '<label>y:</label>' +
-            '<input type="text" id="' + id + '_jGraduate_cy" size="3" title="Enter y value between 0.0 and 1.0"/>' +
-          '</div>' +
-        '</div>' +
-        '<div class="jGraduate_StopSection">' +
-          '<label class="jGraduate_Form_Heading">Focal Point</label>' +
-          '<div class="jGraduate_Form_Section">' +
-            '<label>Match center: <input type="checkbox" checked="checked" id="' + id + '_jGraduate_match_ctr"/></label><br/>' +
-            '<label>x:</label>' +
-            '<input type="text" id="' + id + '_jGraduate_fx" size="3" title="Enter x value between 0.0 and 1.0"/>' +
-            '<label>y:</label>' +
-            '<input type="text" id="' + id + '_jGraduate_fy" size="3" title="Enter y value between 0.0 and 1.0"/>' +
-          '</div>' +
-        '</div>' +
-      '</div>' +
-      '<div class="jGraduate_StopSection jGraduate_SpreadMethod">' +
-        '<label class="jGraduate_Form_Heading">Spread method</label>' +
-        '<div class="jGraduate_Form_Section">' +
-          '<select class="jGraduate_spreadMethod" id="jGraduate_spreadMethod">' +
-            '<option value=pad selected>Pad</option>' +
-            '<option value=reflect>Reflect</option>' +
-            '<option value=repeat>Repeat</option>' +
-          '</select>' +
-        '</div>' +
-      '</div>' +
-      '<div class="jGraduate_Form">' +
-        '<div class="jGraduate_Slider jGraduate_RadiusField jGraduate_rg_field">' +
-          '<label class="prelabel">Radius:</label>' +
-          '<div id="' + id + '_jGraduate_Radius" class="jGraduate_SliderBar jGraduate_Radius" title="Click to set radius">' +
-            '<img id="' + id + '_jGraduate_RadiusArrows" class="jGraduate_RadiusArrows" src="' + $settings.images.clientPath + 'rangearrows2.gif">' +
-          '</div>' +
-          '<label><input type="text" id="' + id + '_jGraduate_RadiusInput" size="3" value="100"/>%</label>' +
-        '</div>' +
-        '<div class="jGraduate_Slider jGraduate_EllipField jGraduate_rg_field">' +
-          '<label class="prelabel">Ellip:</label>' +
-          '<div id="' + id + '_jGraduate_Ellip" class="jGraduate_SliderBar jGraduate_Ellip" title="Click to set Ellip">' +
-            '<img id="' + id + '_jGraduate_EllipArrows" class="jGraduate_EllipArrows" src="' + $settings.images.clientPath + 'rangearrows2.gif">' +
-          '</div>' +
-          '<label><input type="text" id="' + id + '_jGraduate_EllipInput" size="3" value="0"/>%</label>' +
-        '</div>' +
-        '<div class="jGraduate_Slider jGraduate_AngleField jGraduate_rg_field">' +
-          '<label class="prelabel">Angle:</label>' +
-          '<div id="' + id + '_jGraduate_Angle" class="jGraduate_SliderBar jGraduate_Angle" title="Click to set Angle">' +
-            '<img id="' + id + '_jGraduate_AngleArrows" class="jGraduate_AngleArrows" src="' + $settings.images.clientPath + 'rangearrows2.gif">' +
-          '</div>' +
-          '<label><input type="text" id="' + id + '_jGraduate_AngleInput" size="3" value="0"/>deg</label>' +
-        '</div>' +
-        '<div class="jGraduate_Slider jGraduate_OpacField">' +
-          '<label class="prelabel">Opac:</label>' +
-          '<div id="' + id + '_jGraduate_Opac" class="jGraduate_SliderBar jGraduate_Opac" title="Click to set Opac">' +
-            '<img id="' + id + '_jGraduate_OpacArrows" class="jGraduate_OpacArrows" src="' + $settings.images.clientPath + 'rangearrows2.gif">' +
-          '</div>' +
-          '<label><input type="text" id="' + id + '_jGraduate_OpacInput" size="3" value="100"/>%</label>' +
-        '</div>' +
-      '</div>' +
-      '<div class="jGraduate_OkCancel">' +
-        '<input type="button" id="' + id + '_jGraduate_Ok" class="jGraduate_Ok" value="OK"/>' +
-        '<input type="button" id="' + id + '_jGraduate_Cancel" class="jGraduate_Cancel" value="Cancel"/>' +
-      '</div>';
+  // eslint-disable-next-line no-unsanitized/property
+  const html = `<div id="${id}_jGraduate_Swatch" class="jGraduate_Swatch">
+        <h2 class="jGraduate_Title">${$settings.window.pickerTitle}</h2>
+        <div id="${id}_jGraduate_GradContainer" class="jGraduate_GradContainer"></div>
+        <div id="${id}_jGraduate_StopSlider" class="jGraduate_StopSlider"></div>
+      </div>
+      <div class="jGraduate_Form jGraduate_Points jGraduate_lg_field">
+        <div class="jGraduate_StopSection">
+          <label class="jGraduate_Form_Heading">${svgEditor.i18next.t('config.jgraduate_begin_point')}</label>
+          <div class="jGraduate_Form_Section">
+            <label>x:</label>
+              <input type="text" id="${id}_jGraduate_x1" size="3" title="${svgEditor.i18next.t('config.jgraduate_enter_starting_x')}"/>
+            <label>y:</label>
+            <input type="text" id="${id}_jGraduate_y1" size="3" title="${svgEditor.i18next.t('config.jgraduate_enter_starting_y')}"/>
+          </div>
+        </div>
+        <div class="jGraduate_StopSection">
+          <label class="jGraduate_Form_Heading">${svgEditor.i18next.t('config.jgraduate_end_point')}</label>
+          <div class="jGraduate_Form_Section">
+            <label>x:</label>
+            <input type="text" id="${id}_jGraduate_x2" size="3" title="${svgEditor.i18next.t('config.jgraduate_enter_ending_x')}"/>
+            <label>y:</label>
+            <input type="text" id="${id}_jGraduate_y2" size="3" title="${svgEditor.i18next.t('config.jgraduate_enter_ending_y')}"/>
+          </div>
+        </div>
+      </div>
+      <div class="jGraduate_Form jGraduate_Points jGraduate_rg_field">
+        <div class="jGraduate_StopSection">
+          <label class="jGraduate_Form_Heading">${svgEditor.i18next.t('config.jgraduate_center_point')}</label>
+          <div class="jGraduate_Form_Section">
+            <label>x:</label>
+            <input type="text" id="${id}_jGraduate_cx" size="3" title="${svgEditor.i18next.t('config.jgraduate_enter_value_x')}"/>
+            <label>y:</label>
+            <input type="text" id="${id}_jGraduate_cy" size="3" title="${svgEditor.i18next.t('config.jgraduate_enter_value_y')}"/>
+          </div>
+        </div>
+        <div class="jGraduate_StopSection">
+          <label class="jGraduate_Form_Heading">${svgEditor.i18next.t('config.jgraduate_focal_point')}</label>
+          <div class="jGraduate_Form_Section">
+            <label>${svgEditor.i18next.t('config.jgraduate_match_center')} <input type="checkbox" checked="checked" id="${id}_jGraduate_match_ctr"/></label><br/>
+            <label>x:</label>
+            <input type="text" id="${id}_jGraduate_fx" size="3" title="${svgEditor.i18next.t('config.jgraduate_enter_focal_x')}"/>
+            <label>y:</label>
+            <input type="text" id="${id}_jGraduate_fy" size="3" title="${svgEditor.i18next.t('config.jgraduate_enter_focal_y')}"/>
+          </div>
+        </div>
+      </div>
+      <div class="jGraduate_StopSection jGraduate_SpreadMethod">
+        <label class="jGraduate_Form_Heading">${svgEditor.i18next.t('config.jgraduate_spread_method')}</label>
+        <div class="jGraduate_Form_Section">
+          <select class="jGraduate_spreadMethod" id="jGraduate_spreadMethod">
+            <option value=pad selected>${svgEditor.i18next.t('properties.jgraduate_pad')}</option>
+            <option value=reflect>${svgEditor.i18next.t('properties.jgraduate_reflect')}</option>
+            <option value=repeat>${svgEditor.i18next.t('properties.jgraduate_repeat')}</option>
+          </select>
+        </div>
+      </div>
+      <div class="jGraduate_Form">
+        <div class="jGraduate_Slider jGraduate_RadiusField jGraduate_rg_field">
+          <label class="prelabel">${svgEditor.i18next.t('config.jgraduate_radius')}</label>
+          <div id="${id}_jGraduate_Radius" class="jGraduate_SliderBar jGraduate_Radius" title="${svgEditor.i18next.t('config.jgraduate_set_radius')}">
+            <img id="${id}_jGraduate_RadiusArrows" class="jGraduate_RadiusArrows" src="${$settings.images.clientPath}rangearrows2.gif">
+          </div>
+          <label><input type="text" id="${id}_jGraduate_RadiusInput" size="3" value="100"/>%</label>
+        </div>
+        <div class="jGraduate_Slider jGraduate_EllipField jGraduate_rg_field">
+          <label class="prelabel">${svgEditor.i18next.t('config.jgraduate_ellip')}</label>
+          <div id="${id}_jGraduate_Ellip" class="jGraduate_SliderBar jGraduate_Ellip" title="${svgEditor.i18next.t('config.jgraduate_set_ellip')}">
+            <img id="${id}_jGraduate_EllipArrows" class="jGraduate_EllipArrows" src="${$settings.images.clientPath}rangearrows2.gif">
+          </div>
+          <label><input type="text" id="${id}_jGraduate_EllipInput" size="3" value="0"/>%</label>
+        </div>
+        <div class="jGraduate_Slider jGraduate_AngleField jGraduate_rg_field">
+          <label class="prelabel">${svgEditor.i18next.t('config.jgraduate_angle')}</label>
+          <div id="${id}_jGraduate_Angle" class="jGraduate_SliderBar jGraduate_Angle" title="${svgEditor.i18next.t('config.jgraduate_set_angle')}">
+            <img id="${id}_jGraduate_AngleArrows" class="jGraduate_AngleArrows" src="${$settings.images.clientPath}rangearrows2.gif">
+          </div>
+          <label><input type="text" id="${id}_jGraduate_AngleInput" size="3" value="0"/>${svgEditor.i18next.t('config.jgraduate_deg')}</label>
+        </div>
+        <div class="jGraduate_Slider jGraduate_OpacField">
+          <label class="prelabel">${svgEditor.i18next.t('config.jgraduate_opac')}</label>
+          <div id="${id}_jGraduate_Opac" class="jGraduate_SliderBar jGraduate_Opac" title="${svgEditor.i18next.t('config.jgraduate_set_opac')}">
+            <img id="${id}_jGraduate_OpacArrows" class="jGraduate_OpacArrows" src="${$settings.images.clientPath}rangearrows2.gif">
+          </div>
+          <label><input type="text" id="${id}_jGraduate_OpacInput" size="3" value="100"/>%</label>
+        </div>
+      </div>
+      <div class="jGraduate_OkCancel">
+        <input type="button" id="${id}_jGraduate_Ok" class="jGraduate_Ok" value="${svgEditor.i18next.t("common.ok")}"/>
+        <input type="button" id="${id}_jGraduate_Cancel" class="jGraduate_Cancel" value="${svgEditor.i18next.t("common.cancel")}"/>
+      </div>`;
   const div = document.createElement('div');
   div.innerHTML = html;
   while (div.children.length > 0) {
diff --git a/src/editor/locale/lang.en.js b/src/editor/locale/lang.en.js
index 7ba6bbed..f387f4a2 100644
--- a/src/editor/locale/lang.en.js
+++ b/src/editor/locale/lang.en.js
@@ -87,7 +87,10 @@ export default {
     times: 'times',
     prefs_and_content: 'Store preferences and SVG content locally',
     prefs_only: 'Only store preferences locally',
-    no_prefs_or_content: 'Do not store my preferences or SVG content locally'
+    no_prefs_or_content: 'Do not store my preferences or SVG content locally',
+    jgraduate_pad: 'Pad',
+    jgraduate_reflect: 'Reflect',
+    jgraduate_repeat: 'Repeat',
   },
   tools: {
     main_menu: 'Main Menu',
@@ -233,7 +236,33 @@ export default {
     jpicker_tooltip_alpha_radio: 'Set To &ldquo;Alpha&rdquo; Color Mode',
     jpicker_tooltip_alpha_textbox: 'Enter A &ldquo;Alpha&rdquo; Value (0-100)',
     jpicker_tooltip_hex_textbox: 'Enter A &ldquo;Hex&rdquo; Color Value (#000000-#ffffff)',
-    jpicker_tooltip_hex_alpha: 'Enter A &ldquo;Alpha&rdquo; Value (#00-#ff)'
+    jpicker_tooltip_hex_alpha: 'Enter A &ldquo;Alpha&rdquo; Value (#00-#ff)',
+    jgraduate_solid_color: 'Solid Color',
+    jgraduate_linear_gradient: 'Linear Gradient',
+    jgraduate_radial_gradient: 'Radial Gradient',
+    jgraduate_begin_point: 'Begin Point',
+    jgraduate_enter_starting_x: 'Enter starting x value between 0.0 and 1.0',
+    jgraduate_enter_starting_y: 'Enter starting y value between 0.0 and 1.0',
+    jgraduate_end_point: 'End Point',
+    jgraduate_enter_ending_x: 'Enter ending x value between 0.0 and 1.0',
+    jgraduate_enter_ending_y: 'Enter ending y value between 0.0 and 1.0',
+    jgraduate_center_point: 'Center Point',
+    jgraduate_enter_value_x: 'Enter x value between 0.0 and 1.0',
+    jgraduate_enter_value_x: 'Enter y value between 0.0 and 1.0',
+    jgraduate_focal_point: 'Focal Point',
+    jgraduate_match_center: 'Match center:',
+    jgraduate_enter_focal_x: 'Enter x value between 0.0 and 1.0',
+    jgraduate_enter_focal_y: 'Enter y value between 0.0 and 1.0',
+    jgraduate_spread_method: 'Spread method',
+    jgraduate_radius: 'Radius:',
+    jgraduate_set_radius: 'Click to set radius',
+    jgraduate_ellip: 'Ellip:',
+    jgraduate_set_ellip: 'Click to set Ellip',
+    jgraduate_angle: 'Angle:',
+    jgraduate_set_angle: 'Click to set Angle',
+    jgraduate_deg: 'deg:',
+    jgraduate_opac: 'Opac:',
+    jgraduate_set_opac: 'Click to set Opac',
   },
   notification: {
     invalidAttrValGiven: 'Invalid value given',