diff --git a/src/controls/draw.js b/src/controls/draw.js
index dd2a5c6aa..4ef6640a3 100644
--- a/src/controls/draw.js
+++ b/src/controls/draw.js
@@ -5,8 +5,14 @@ import exportToFile from '../utils/exporttofile';
 import validate from '../utils/validate';
 
 const Draw = function Draw(options = {}) {
+  const localization = options.localization;
+
+  function localize(key) {
+    return localization.getStringByKeys({ targetParentKey: 'draw', targetKey: key });
+  }
+
   const {
-    buttonText = 'Rita',
+    buttonText = localize('title'),
     placement = ['menu'],
     icon = '#fa-pencil',
     annotation,
@@ -21,9 +27,9 @@ const Draw = function Draw(options = {}) {
   } = options;
 
   const drawDefaults = {
-    layerTitle: 'Ritlager',
+    layerTitle: localize('drawLayerTitleDefault'),
     groupName: 'none',
-    groupTitle: 'Ritlager',
+    groupTitle: localize('drawGroupTitleDefault'),
     visible: true,
     styleByAttribute: true,
     queryable: false,
@@ -105,19 +111,19 @@ const Draw = function Draw(options = {}) {
           cls: 'margin-small icon-smaller light box-shadow',
           style: 'border-radius: 3px',
           icon: '#ic_save_24px',
-          text: 'Spara'
+          text: localize('popupSaveButton')
         });
 
         const cancelButton = Button({
           cls: 'margin-small icon-smaller light box-shadow',
           style: 'border-radius: 3px',
           icon: '#ic_close_24px',
-          text: 'Avbryt'
+          text: localize('popupCancelButton')
         });
 
         const inputEl = Input({
           cls: 'no-margin',
-          placeholderText: 'Ange popuptext',
+          placeholderText: localize('popupPlaceholderText'),
           value: val
         });
 
@@ -127,7 +133,7 @@ const Draw = function Draw(options = {}) {
         });
 
         const modal = Modal({
-          title: 'Popuptext',
+          title: localize('popupTextModalTitle'),
           contentCmp: modalContent,
           target: viewer.getId()
         });
@@ -175,7 +181,7 @@ const Draw = function Draw(options = {}) {
 
         const inputEl = Input({
           cls: 'margin-right',
-          placeholderText: 'Ange lagernamn',
+          placeholderText: localize('layerDialogLayerNamePlaceholder'),
           value: layerTitle
         });
 
@@ -191,7 +197,7 @@ const Draw = function Draw(options = {}) {
             drawHandler.setActiveLayer(drawLayer);
             thisForm.dispatch('activeLayerChange', { layername: layerName });
           },
-          tooltipText: 'Aktivera ritlager',
+          tooltipText: localize('layerDialogActivateLayerTooltip'),
           tooltipPlacement: 'west'
         });
 
@@ -203,13 +209,13 @@ const Draw = function Draw(options = {}) {
           cls: 'padding-small icon-smaller round light box-shadow relative o-tooltip',
           icon: '#ic_delete_24px',
           async click() {
-            if (window.confirm('Vill du radera det här ritlagret?') === true) {
+            if (window.confirm(localize('layerDialogDeleteLayerConfirm')) === true) {
               await map.removeLayer(drawLayer);
               modal.closeModal();
               thisForm.show();
             }
           },
-          tooltipText: 'Radera ritlager',
+          tooltipText: localize('layerDialogDeleteLayerTooltip'),
           tooltipPlacement: 'west'
         });
 
@@ -223,7 +229,7 @@ const Draw = function Draw(options = {}) {
               filename: drawLayer.get('title') || 'export'
             });
           },
-          tooltipText: 'Ladda ner ritlager',
+          tooltipText: localize('layerDialogDownloadLayerTooltip'),
           tooltipPlacement: 'west'
         });
 
@@ -240,7 +246,7 @@ const Draw = function Draw(options = {}) {
         cls: 'icon-smaller light box-shadow',
         style: 'border-radius: 3px',
         icon: '#ic_add_24px',
-        text: 'Nytt ritlager',
+        text: localize('layerDialogAddLayerButton'),
         async click() {
           let title = drawOptions.layerTitle;
           if (viewer.getLayersByProperty('title', title).length > 0) {
@@ -295,15 +301,15 @@ const Draw = function Draw(options = {}) {
           inputEl.value = null;
           inputEl.click();
         },
-        text: 'Importera ritlager',
-        ariaLabel: 'Importera ritlager'
+        text: localize('layerDialogImportLayerButton'),
+        ariaLabel: localize('layerDialogImportLayerButton')
       });
 
       const okButton = Button({
         cls: 'icon-smaller light box-shadow',
         style: 'border-radius: 3px',
         icon: '#ic_check_24px',
-        text: 'OK',
+        text: localize('layerDialogOkButton'),
         click() {
           modal.closeModal();
         }
@@ -324,7 +330,7 @@ const Draw = function Draw(options = {}) {
       });
 
       modal = Modal({
-        title: 'Ritlager',
+        title: localize('layerDialogTitle'),
         contentCmp: modalContent,
         target: viewer.getId(),
         style: 'max-width:100%;width:400px;'
@@ -344,7 +350,7 @@ const Draw = function Draw(options = {}) {
       }
     },
     icon: '#ic_place_24px',
-    tooltipText: 'Punkt',
+    tooltipText: localize('pointButtonTooltip'),
     tooltipPlacement: 'south',
     tooltipStyle: 'bottom:-5px;',
     state: 'inactive'
@@ -360,7 +366,7 @@ const Draw = function Draw(options = {}) {
       }
     },
     icon: '#ic_timeline_24px',
-    tooltipText: 'Linje',
+    tooltipText: localize('lineButtonTooltip'),
     tooltipPlacement: 'south',
     tooltipStyle: 'bottom:-5px;'
   });
@@ -375,7 +381,7 @@ const Draw = function Draw(options = {}) {
       }
     },
     icon: '#o_polygon_24px',
-    tooltipText: 'Polygon',
+    tooltipText: localize('polygonButtonTooltip'),
     tooltipPlacement: 'south',
     tooltipStyle: 'bottom:-5px;'
   });
@@ -390,7 +396,7 @@ const Draw = function Draw(options = {}) {
       }
     },
     icon: '#ic_title_24px',
-    tooltipText: 'Text',
+    tooltipText: localize('textButtonTooltip'),
     tooltipPlacement: 'south',
     tooltipStyle: 'bottom:-5px;'
   });
@@ -404,7 +410,7 @@ const Draw = function Draw(options = {}) {
         attributeForm.show();
       },
       icon: '#ic_textsms_24px',
-      tooltipText: 'Attribut',
+      tooltipText: localize('attributeButtonTooltip'),
       tooltipPlacement: 'south',
       tooltipStyle: 'bottom:-5px;',
       state: 'disabled'
@@ -423,7 +429,7 @@ const Draw = function Draw(options = {}) {
       } else { this.setState('active'); }
     },
     icon: '#ic_palette_24px',
-    tooltipText: 'Stil',
+    tooltipText: localize('styleButtonTooltip'),
     tooltipPlacement: 'south',
     tooltipStyle: 'bottom:-5px;'
   });
@@ -437,7 +443,7 @@ const Draw = function Draw(options = {}) {
         layerForm.show();
       },
       icon: '#ic_layers_24px',
-      tooltipText: 'Lager',
+      tooltipText: localize('layerButtonTooltip'),
       tooltipPlacement: 'south',
       tooltipStyle: 'bottom:-5px;'
     });
@@ -452,7 +458,7 @@ const Draw = function Draw(options = {}) {
         thisComponent.dispatch('saveFeatures', true);
       },
       icon: '#ic_save_24px',
-      tooltipText: 'Spara',
+      tooltipText: localize('saveButtonTooltip'),
       tooltipPlacement: 'south',
       tooltipStyle: 'bottom:-5px;',
       state: 'disabled'
@@ -473,7 +479,7 @@ const Draw = function Draw(options = {}) {
         });
       },
       icon: '#ic_download_24px',
-      tooltipText: 'Ladda ner',
+      tooltipText: localize('downloadButtonTooltip'),
       tooltipPlacement: 'south',
       tooltipStyle: 'bottom:-5px;'
     });
@@ -488,7 +494,7 @@ const Draw = function Draw(options = {}) {
       }
     },
     icon: '#ic_delete_24px',
-    tooltipText: 'Ta bort',
+    tooltipText: localize('deleteButtonTooltip'),
     tooltipPlacement: 'south',
     tooltipStyle: 'bottom:-5px;',
     state: 'disabled'
@@ -505,7 +511,7 @@ const Draw = function Draw(options = {}) {
       viewer.dispatch('toggleClickInteraction', { name: 'draw', active: false });
     },
     icon: '#ic_close_24px',
-    tooltipText: 'Stäng',
+    tooltipText: localize('closeButtonTooltip'),
     tooltipPlacement: 'south',
     tooltipStyle: 'bottom:-5px;'
   });
@@ -549,7 +555,7 @@ const Draw = function Draw(options = {}) {
         Text: textButton
       };
       const extraTools = drawOptions.drawTools || [];
-      drawExtraTools(extraTools, viewer, drawTools);
+      drawExtraTools({ extraTools, viewer, toolCmps: drawTools, localize });
     },
     onAdd(evt) {
       viewer = evt.target;
diff --git a/src/controls/draw/drawtools.js b/src/controls/draw/drawtools.js
index 93fd2f010..001cdd868 100644
--- a/src/controls/draw/drawtools.js
+++ b/src/controls/draw/drawtools.js
@@ -3,19 +3,17 @@ import utils from '../../utils';
 
 const createElement = utils.createElement;
 
-let viewer;
-
-const drawToolsSelector = function drawToolsSelector(extraTools, v, toolCmps) {
+const drawToolsSelector = function drawToolsSelector({ extraTools, viewer, toolCmps, localize }) {
   const toolNames = {
-    Polygon: 'Polygon',
-    Point: 'Punkt',
-    LineString: 'Linje',
-    box: 'Rektangel',
-    square: 'Kvadrat',
-    circle: 'Cirkel',
-    freehand: 'Frihandsläge'
+    Polygon: localize('drawPolygon'),
+    Point: localize('drawPoint'),
+    LineString: localize('drawLine'),
+    box: localize('drawBox'),
+    square: localize('drawSquare'),
+    circle: localize('drawCircle'),
+    freehand: localize('drawFreehand')
   };
-  viewer = v;
+
   const drawCmp = viewer.getControlByName('draw');
   let drawTools;
   const map = viewer.getMap();
diff --git a/src/controls/measure.js b/src/controls/measure.js
index 69b958198..fcfb87696 100644
--- a/src/controls/measure.js
+++ b/src/controls/measure.js
@@ -87,11 +87,11 @@ const Measure = function Measure({
     if (!drawType || drawType === geomType) {
       if (geomType === 'Polygon') {
         point = geometry.getInteriorPoint();
-        label = drawStyles.formatArea(geometry, useHectare, projection, 0, localization);
+        label = drawStyles.formatArea({ polygon: geometry, useHectare, projection, featureArea: 0, localization });
         line = new LineString(geometry.getCoordinates()[0]);
       } else if (geomType === 'LineString') {
         point = new Point(geometry.getLastCoordinate());
-        label = drawStyles.formatLength(geometry, projection, localization);
+        label = drawStyles.formatLength({ line: geometry, projection, localization });
         line = geometry;
       }
     }
diff --git a/src/loc/en_US.json b/src/loc/en_US.json
index fe8490d26..649aea7a4 100644
--- a/src/loc/en_US.json
+++ b/src/loc/en_US.json
@@ -69,6 +69,42 @@
             "portraitAriaLabel": "Portrait",
             "landscape": "Landscape",
             "landscapeAriaLabel": "Landscape"
+        },
+        "draw": {
+            "title": "Draw",
+            "popupSaveButton": "Save",
+            "popupCancelButton": "Cancel",
+            "popupPlaceholderText": "Enter popup text",
+            "popupTextModalTitle": "Popup text",
+            "layerDialogLayerNamePlaceholder": "Enter layer name",
+            "layerDialogActivateLayerTooltip": "Activate layer",
+            "layerDialogDeleteLayerConfirm": "Delete draw layer?",
+            "layerDialogDeleteLayerTooltip": "Delete draw layer",
+            "layerDialogDownloadLayerTooltip": "Download draw layer",
+            "layerDialogAddLayerButton": "New",
+            "layerDialogImportLayerButton": "Import",
+            "layerDialogOkButton": "OK",
+            "layerDialogTitle": "Draw layers",
+            "pointButtonTooltip": "Point",
+            "lineButtonTooltip": "Line",
+            "polygonButtonTooltip": "Polygon",
+            "textButtonTooltip": "Text",
+            "attributeButtonTooltip": "Attributes",
+            "styleButtonTooltip": "Style",
+            "layerButtonTooltip": "Layers",
+            "saveButtonTooltip": "Save",
+            "downloadButtonTooltip": "Download",
+            "deleteButtonTooltip": "Delete",
+            "closeButtonTooltip": "Close",
+            "drawLayerTitleDefault": "Draw layer",
+            "drawGroupTitleDefault": "Draw layers",
+            "drawPolygon": "Polygon",
+            "drawPoint": "Point",
+            "drawLine": "Line",
+            "drawBox": "Rectangle",
+            "drawSquare": "Square",
+            "drawCircle": "Circle",
+            "drawFreehand": "Freehand"
         }
     },
     "style": {
@@ -80,7 +116,35 @@
 
         },
         "styleTemplate": {
-
+            "fillColor": "Fill",
+            "backgroundFillColor": "Background fill",
+            "opacity": "Opacity",
+            "strokeWidth": "Line width",
+            "textSize": "Text size",
+            "pointSize": "Point size",
+            "showLengthArea": "Show length/area",
+            "showSegments": "Show segments",
+            "stroke": "Line",
+            "strokeTypeSolid": "Solid line",
+            "strokeTypeDotted": "Dotted line",
+            "strokeTypeDashed" : "Dashed line",
+            "strokeTypeDashedDotted" : "Dash-dotted line",
+            "dimensions": "Dimensions",
+            "margins": "Margins",
+            "rotation": "Rotation",
+            "degreesRotation": "Degrees",
+            "marginForText": "Margin",
+            "frame": "Frame",
+            "margin": "Margin",
+            "point": "Point",
+            "pointTypePoint": "Point",
+            "pointTypeCircle": "Circle",
+            "pointTypeX": "X",
+            "pointTypePlus": "Plus",
+            "pointTypeStar": "Star",
+            "pointTypeTriangle": "Triangle",
+            "pointTypeSquare": "Square",
+            "pointTypeMarker": "Marker"
         }
     }
 }
\ No newline at end of file
diff --git a/src/loc/sv_SE.json b/src/loc/sv_SE.json
index d35dbd3e0..48a06422e 100644
--- a/src/loc/sv_SE.json
+++ b/src/loc/sv_SE.json
@@ -69,6 +69,42 @@
             "portraitAriaLabel": "Stående",
             "landscape": "Liggande",
             "landscapeAriaLabel": "Liggande"
+        },
+        "draw": {
+            "title": "Rita",
+            "popupSaveButton": "Spara",
+            "popupCancelButton": "Avbryt",
+            "popupPlaceholderText": "Ange popuptext",
+            "popupTextModalTitle": "Popuptext",
+            "layerDialogLayerNamePlaceholder": "Ange lagernamn",
+            "layerDialogActivateLayerTooltip": "Aktivera ritlager",
+            "layerDialogDeleteLayerConfirm": "Vill du radera det här ritlagret?",
+            "layerDialogDeleteLayerTooltip": "Radera ritlager",
+            "layerDialogDownloadLayerTooltip": "Ladda ner ritlager",
+            "layerDialogAddLayerButton": "Nytt ritlager",
+            "layerDialogImportLayerButton": "Importera ritlager",
+            "layerDialogOkButton": "OK",
+            "layerDialogTitle": "Ritlager",
+            "pointButtonTooltip": "Punkt",
+            "lineButtonTooltip": "Linje",
+            "polygonButtonTooltip": "Polygon",
+            "textButtonTooltip": "Text",
+            "attributeButtonTooltip": "Attribut",
+            "styleButtonTooltip": "Stil",
+            "layerButtonTooltip": "Lager",
+            "saveButtonTooltip": "Spara",
+            "downloadButtonTooltip": "Ladda ner",
+            "deleteButtonTooltip": "Ta bort",
+            "closeButtonTooltip": "Stäng",
+            "drawLayerTitleDefault": "Ritlager",
+            "drawGroupTitleDefault": "Ritlager",
+            "drawPolygon": "Polygon",
+            "drawPoint": "Punkt",
+            "drawLine": "Linje",
+            "drawBox": "Rektangel",
+            "drawSquare": "Fyrkant",
+            "drawCircle": "Cirkel",
+            "drawFreehand": "Frihand"
         }
 
     },
@@ -77,11 +113,39 @@
             "modifyTooltip": "Dra för att ändra"
         },
         "styleWindow": {
-            "title": "Configure style"
+            "title": "Definiera stil"
 
         },
         "styleTemplate": {
-
+            "fillColor": "Fyllning",
+            "backgroundFillColor": "Bakgrundsfyllning",
+            "opacity": "Opacitet",
+            "strokeWidth": "Linjebredd",
+            "textSize": "Textstorlek",
+            "pointSize": "Punktstorlek",
+            "showLengthArea": "Visa längd/area",
+            "showSegments": "Visa dellängder",
+            "stroke": "Linje",
+            "strokeTypeSolid": "Heldragen linje",
+            "strokeTypeDotted": "Punktad linje",
+            "strokeTypeDashed" : "Streckad linje",
+            "strokeTypeDashedDotted" : "Streck-punkt-linje",
+            "dimensions": "Mått",
+            "margins": "Marginaler",
+            "rotation": "Rotation",
+            "degreesRotation": "Grader",
+            "marginForText": "Marginal",
+            "frame": "Ram",
+            "margin": "Marginal",
+            "point": "Punkt",
+            "pointTypePoint": "Punkt",
+            "pointTypeCircle": "Cirkel",
+            "pointTypeX": "Kryss",
+            "pointTypePlus": "Kors",
+            "pointTypeStar": "Stjärna",
+            "pointTypeTriangle": "Tringel",
+            "pointTypeSquare": "Fyrkant",
+            "pointTypeMarker": "Markör"
         }
     }
 }
\ No newline at end of file
diff --git a/src/style/drawstyles.js b/src/style/drawstyles.js
index c84fe4313..4df186ca7 100644
--- a/src/style/drawstyles.js
+++ b/src/style/drawstyles.js
@@ -140,8 +140,8 @@ function createRegularShape(type, pointSize, pointFill, pointStroke, pointRotati
   return style;
 }
 
-function formatLength(line, projection, localization) {
-  const localeNumberFormat = new Intl.NumberFormat(localization.getCurrentLocaleId());
+function formatLength({ line, projection, localization }) {
+  const localeNumberFormat = localization?.getCurrentLocaleId() ? new Intl.NumberFormat(localization?.getCurrentLocaleId()) : new Intl.NumberFormat();
 
   const length = getLength(line, { projection });
   let output;
@@ -153,12 +153,10 @@ function formatLength(line, projection, localization) {
   return output;
 }
 
-function formatArea(polygon, useHectare, projection, featureArea, localization) {
+function formatArea({ polygon, useHectare, projection, featureArea, localization }) {
   const area = featureArea || getArea(polygon, { projection });
-  console.log('area');
-  console.log(area);
 
-  const localeNumberFormat = new Intl.NumberFormat(localization.getCurrentLocaleId());
+  const localeNumberFormat = localization?.getCurrentLocaleId() ? new Intl.NumberFormat(localization?.getCurrentLocaleId()) : new Intl.NumberFormat();
   let output;
   if (area > 10000000) {
     output = `${localeNumberFormat.format(Math.round((area / 1000000) * 100) / 100)} km\xB2`;
@@ -171,7 +169,7 @@ function formatArea(polygon, useHectare, projection, featureArea, localization)
 }
 
 function formatRadius(feat, localization) {
-  const localeNumberFormat = new Intl.NumberFormat(localization.getCurrentLocaleId());
+  const localeNumberFormat = localization?.getCurrentLocaleId() ? new Intl.NumberFormat(localization?.getCurrentLocaleId()) : new Intl.NumberFormat();
   let output;
   const length = feat.getGeometry().getRadius();
   if (length > 10000) {
@@ -406,7 +404,7 @@ function getSegmentLabelStyle({ line, projection, scale = 1, segmentStyles = [],
   const style = [];
   line.forEachSegment((a, b) => {
     const segment = new LineString([a, b]);
-    const segmentLabel = formatLength(segment, projection, localization);
+    const segmentLabel = formatLength({ line: segment, projection, localization });
     if (segmentStyles.length - 1 < count) {
       segmentStyles.push(segmentStyle(scale).clone());
     }
diff --git a/src/style/styletemplate.js b/src/style/styletemplate.js
index da92b8161..44f7c9953 100644
--- a/src/style/styletemplate.js
+++ b/src/style/styletemplate.js
@@ -1,7 +1,10 @@
-export default function styleTemplate(palette, swStyle) {
+export default function styleTemplate({ palette, swStyle, localization }) {
+  function localize(key) {
+    return localization.getStringByKeys({ targetParentKey: 'styleTemplate', targetKey: key });
+  }
   const colorArray = palette;
-  let fillHtml = '<div id="o-draw-style-fill" class="padding border-bottom"><div class="text-large text-align-center">Fyllning</div><div id="o-draw-style-fillColor"><ul>';
-  let backgroundFillHtml = '<div id="o-draw-style-backgroundFill" class="padding border-bottom"><div class="text-large text-align-center">Bakgrundsfyllning</div><div id="o-draw-style-backgroundFillColor"><ul>';
+  let fillHtml = `<div id="o-draw-style-fill" class="padding border-bottom"><div class="text-large text-align-center">${localize('fillColor')}</div><div id="o-draw-style-fillColor"><ul>`;
+  let backgroundFillHtml = `<div id="o-draw-style-backgroundFill" class="padding border-bottom"><div class="text-large text-align-center">${localize('backgroundFillColor')}</div><div id="o-draw-style-backgroundFillColor"><ul>`;
   if (!colorArray.includes(swStyle.fillColor)) {
     colorArray.push(swStyle.fillColor);
   }
@@ -24,7 +27,7 @@ export default function styleTemplate(palette, swStyle) {
   <input id="o-draw-style-fillOpacitySlider" type="range" min="0.05" max="1" value="${swStyle.fillOpacity}" step="0.05">
   <div class="text-align-center">
     <span class="text-smaller float-left">5%</span>
-    <span class="text-smaller">Opacitet</span>
+    <span class="text-smaller">${localize('opacity')}</span>
     <span class="text-smaller float-right">100%</span>
   </div>
   </div></div>`;
@@ -33,12 +36,12 @@ export default function styleTemplate(palette, swStyle) {
   <input id="o-draw-style-backgroundFillOpacitySlider" type="range" min="0" max="1" value="${swStyle.backgroundFillOpacity}" step="0.05">
   <div class="text-align-center">
     <span class="text-smaller float-left">0%</span>
-    <span class="text-smaller">Opacitet</span>
+    <span class="text-smaller">${localize('opacity')}</span>
     <span class="text-smaller float-right">100%</span>
   </div>
   </div></div>`;
 
-  let strokeHtml = '<div id="o-draw-style-stroke" class="padding border-bottom"><div class="text-large text-align-center">Kantlinje</div><div id="o-draw-style-strokeColor"><ul>';
+  let strokeHtml = `<div id="o-draw-style-stroke" class="padding border-bottom"><div class="text-large text-align-center">${localize('stroke')}</div><div id="o-draw-style-strokeColor"><ul>`;
   for (let i = 0; i < colorArray.length; i += 1) {
     const checked = colorArray[i] === swStyle.strokeColor ? ' checked=true' : '';
     strokeHtml += `<li>
@@ -51,7 +54,7 @@ export default function styleTemplate(palette, swStyle) {
   <input id="o-draw-style-strokeOpacitySlider" type="range" min="0.05" max="1" value="${swStyle.strokeOpacity}" step="0.05">
   <div class="text-align-center">
     <span class="text-smaller float-left">5%</span>
-    <span class="text-smaller">Opacitet</span>
+    <span class="text-smaller">${localize('opacity')}</span>
     <span class="text-smaller float-right">100%</span>
   </div>
   </div>
@@ -59,20 +62,20 @@ export default function styleTemplate(palette, swStyle) {
   <input id="o-draw-style-strokeWidthSlider" type="range" min="1" max="10" value="${swStyle.strokeWidth}" step="1">
   <div class="text-align-center">
     <span class="text-smaller float-left">1px</span>
-    <span class="text-smaller">Linjebredd</span>
+    <span class="text-smaller">${localize('strokeWidth')}</span>
     <span class="text-smaller float-right">10px</span>
   </div>
   </div>
   <div class="padding-smaller o-tooltip active">
     <select id="o-draw-style-strokeType" class="small no-margin width-full">
-      <option value="line"${swStyle.strokeType === 'line' ? ' selected' : ''}>Heldragen linje</option>
-      <option value="dash"${swStyle.strokeType === 'dash' ? ' selected' : ''}>Streckad linje</option>
-      <option value="point"${swStyle.strokeType === 'point' ? ' selected' : ''}>Punktad linje</option>
-      <option value="dash-point"${swStyle.strokeType === 'dash-point' ? ' selected' : ''}>Streck-punkt-linje</option>
+      <option value="line"${swStyle.strokeType === 'line' ? ' selected' : ''}>${localize('strokeTypeSolid')}</option>
+      <option value="dash"${swStyle.strokeType === 'dash' ? ' selected' : ''}>${localize('strokeTypeDashed')}</option>
+      <option value="point"${swStyle.strokeType === 'point' ? ' selected' : ''}>${localize('strokeTypeDotted')}</option>
+      <option value="dash-point"${swStyle.strokeType === 'dash-point' ? ' selected' : ''}>${localize('strokeTypeDashedDotted')}</option>
     </select>
   </div></div>`;
 
-  let backgroundStrokeHtml = '<div id="o-draw-style-backgroundStroke" class="padding border-bottom"><div class="text-large text-align-center">Bakgrundsram</div><div id="o-draw-style-backgroundStrokeColor"><ul>';
+  let backgroundStrokeHtml = `<div id="o-draw-style-backgroundStroke" class="padding border-bottom"><div class="text-large text-align-center">${localize('frame')}</div><div id="o-draw-style-backgroundStrokeColor"><ul>`;
   for (let i = 0; i < colorArray.length; i += 1) {
     const checked = colorArray[i] === swStyle.backgroundStrokeColor ? ' checked=true' : '';
     backgroundStrokeHtml += `<li>
@@ -85,7 +88,7 @@ export default function styleTemplate(palette, swStyle) {
   <input id="o-draw-style-backgroundStrokeOpacitySlider" type="range" min="0" max="1" value="${swStyle.backgroundStrokeOpacity}" step="0.05">
   <div class="text-align-center">
     <span class="text-smaller float-left">0%</span>
-    <span class="text-smaller">Opacitet</span>
+    <span class="text-smaller">${localize('opacity')}</span>
     <span class="text-smaller float-right">100%</span>
   </div>
   </div>
@@ -93,36 +96,36 @@ export default function styleTemplate(palette, swStyle) {
   <input id="o-draw-style-backgroundStrokeWidthSlider" type="range" min="1" max="10" value="${swStyle.backgroundStrokeWidth}" step="1">
   <div class="text-align-center">
     <span class="text-smaller float-left">1px</span>
-    <span class="text-smaller">Linjebredd</span>
+    <span class="text-smaller">${localize('strokeWidth')}</span>
     <span class="text-smaller float-right">10px</span>
   </div>
   </div>
   <div class="padding-smaller o-tooltip active">
     <select id="o-draw-style-backgroundStrokeType" class="small no-margin width-full">
-      <option value="line"${swStyle.backgroundStrokeType === 'line' ? ' selected' : ''}>Heldragen linje</option>
-      <option value="dash"${swStyle.backgroundStrokeType === 'dash' ? ' selected' : ''}>Streckad linje</option>
-      <option value="point"${swStyle.backgroundStrokeType === 'point' ? ' selected' : ''}>Punktad linje</option>
-      <option value="dash-point"${swStyle.backgroundStrokeType === 'dash-point' ? ' selected' : ''}>Streck-punkt-linje</option>
+      <option value="line"${swStyle.backgroundStrokeType === 'line' ? ' selected' : ''}>${localize('strokeTypeSolid')}</option>
+      <option value="dash"${swStyle.backgroundStrokeType === 'dash' ? ' selected' : ''}>${localize('strokeTypeDashed')}</option>
+      <option value="point"${swStyle.backgroundStrokeType === 'point' ? ' selected' : ''}>${localize('strokeTypeDotted')}</option>
+      <option value="dash-point"${swStyle.backgroundStrokeType === 'dash-point' ? ' selected' : ''}>${localize('strokeTypeDashedDotted')}</option>
     </select>
   </div></div>`;
 
-  const pointHtml = `<div id="o-draw-style-point" class="padding border-bottom"><div class="text-large text-align-center">Punkt</div><div class="padding-smaller o-tooltip active">
+  const pointHtml = `<div id="o-draw-style-point" class="padding border-bottom"><div class="text-large text-align-center">${localize('point')}</div><div class="padding-smaller o-tooltip active">
     <input id="o-draw-style-pointSizeSlider" type="range" min="1" max="50" value="${swStyle.pointSize}" step="1">
     <div class="text-align-center">
       <span class="text-smaller float-left">1px</span>
-      <span class="text-smaller">Punktstorlek</span>
+      <span class="text-smaller">${localize('pointSize')}</span>
       <span class="text-smaller float-right">50px</span>
     </div>
   </div>
   <div class="padding-smaller o-tooltip active">
     <select id="o-draw-style-pointType" class="small no-margin width-full">
-      <option value="circle"${swStyle.pointType === 'circle' ? ' selected' : ''}>Cirkel</option>
-      <option value="x"${swStyle.pointType === 'x' ? ' selected' : ''}>Kryss</option>
-      <option value="cross"${swStyle.pointType === 'cross' ? ' selected' : ''}>Kors</option>
-      <option value="star"${swStyle.pointType === 'star' ? ' selected' : ''}>Stjärna</option>
-      <option value="triangle"${swStyle.pointType === 'triangle' ? ' selected' : ''}>Triangel</option>
-      <option value="square"${swStyle.pointType === 'square' ? ' selected' : ''}>Kvadrat</option>
-      <option value="marker"${swStyle.pointType === 'marker' ? ' selected' : ''}>Markör</option>
+      <option value="circle"${swStyle.pointType === 'circle' ? ' selected' : ''}>${localize('pointTypeCircle')}</option>
+      <option value="x"${swStyle.pointType === 'x' ? ' selected' : ''}>${localize('pointTypeX')}</option>
+      <option value="cross"${swStyle.pointType === 'cross' ? ' selected' : ''}>${localize('pointTypePlus')}</option>
+      <option value="star"${swStyle.pointType === 'star' ? ' selected' : ''}>${localize('pointTypeStar')}</option>
+      <option value="triangle"${swStyle.pointType === 'triangle' ? ' selected' : ''}>${localize('pointTypeTriangle')}</option>
+      <option value="square"${swStyle.pointType === 'square' ? ' selected' : ''}>${localize('pointTypeSquare')}</option>
+      <option value="marker"${swStyle.pointType === 'marker' ? ' selected' : ''}>${localize('pointTypeMarker')}</option>
     </select>
   </div></div>`;
 
@@ -130,7 +133,7 @@ export default function styleTemplate(palette, swStyle) {
     <input id="o-draw-style-textSizeSlider" type="range" min="8" max="128" value="${swStyle.textSize}" step="1">
     <div class="text-align-center">
       <span class="text-smaller float-left">8px</span>
-      <span class="text-smaller">Textstorlek</span>
+      <span class="text-smaller">${localize('textSize')}</span>
       <span class="text-smaller float-right">128px</span>
     </div>
   </div>
@@ -138,31 +141,31 @@ export default function styleTemplate(palette, swStyle) {
     <input id="o-draw-style-textString" class="small no-margin width-full" type="text" value="${swStyle.textString}">
   </div></div>`;
 
-  const measureHtml = `<div id="o-draw-style-measure" class="padding border-bottom"><div class="text-large text-align-center">Mått</div><div class="padding-smaller o-tooltip active">
+  const measureHtml = `<div id="o-draw-style-measure" class="padding border-bottom"><div class="text-large text-align-center">${localize('dimensions')}</div><div class="padding-smaller o-tooltip active">
   <div>
     <input type="checkbox" id="o-draw-style-showMeasure" name="showMeasure"${swStyle.showMeasure ? ' checked' : ''} />
-    <label for="o-draw-style-showMeasure" class="text-weight-normal">Visa längd/area</label>
+    <label for="o-draw-style-showMeasure" class="text-weight-normal">${localize('showLengthArea')}</label>
   </div>
   <div>
     <input type="checkbox" id="o-draw-style-showMeasureSegments" name="showMeasureSegments"${swStyle.showMeasureSegments ? ' checked' : ''} />
-    <label for="o-draw-style-showMeasureSegments" class="text-weight-normal">Visa delsträckor</label>
+    <label for="o-draw-style-showMeasureSegments" class="text-weight-normal">${localize('showSegments')}</label>
   </div>
 </div></div>`;
 
-  const rotateHtml = `<div id="o-draw-style-rotation" class="padding border-bottom"><div class="text-large text-align-center">Rotation</div><div class="padding-smaller o-tooltip active">
+  const rotateHtml = `<div id="o-draw-style-rotation" class="padding border-bottom"><div class="text-large text-align-center">${localize('rotation')}</div><div class="padding-smaller o-tooltip active">
 <input id="o-draw-style-rotationSlider" type="range" min="0" max="720" value="${swStyle.objRotation}" step="1">
 <div class="text-align-center">
   <span class="text-smaller float-left">0&deg;</span>
-  <span class="text-smaller">Graders rotation</span>
+  <span class="text-smaller">${localize('degreesRotation')}</span>
   <span class="text-smaller float-right">360&deg;</span>
 </div>
 </div>`;
 
-  const paddingHtml = `<div id="o-draw-style-padding" class="padding border-bottom"><div class="text-large text-align-center">Marginaler</div><div class="padding-smaller o-tooltip active">
+  const paddingHtml = `<div id="o-draw-style-padding" class="padding border-bottom"><div class="text-large text-align-center">${localize('margins')}</div><div class="padding-smaller o-tooltip active">
 <input id="o-draw-style-paddingSlider" type="range" min="0" max="30" value="${swStyle.paddingText}" step="1">
 <div class="text-align-center">
   <span class="text-smaller float-left">0px</span>
-  <span class="text-smaller">Marginal till text</span>
+  <span class="text-smaller">${localize('marginForText')}</span>
   <span class="text-smaller float-right">30px</span>
 </div>
 </div>`;
diff --git a/src/style/stylewindow.js b/src/style/stylewindow.js
index 1597d5069..d69a2bddf 100644
--- a/src/style/stylewindow.js
+++ b/src/style/stylewindow.js
@@ -12,8 +12,13 @@ import { Component, Button, Element, dom } from '../ui';
 import formatLengthString from '../utils/formatlengthstring';
 
 const Stylewindow = function Stylewindow(optOptions = {}) {
+  const { localization } = optOptions;
+  function localize(key) {
+    return localization.getStringByKeys({ targetParentKey: 'styleWindow', targetKey: key });
+  }
+
   const {
-    title = 'Anpassa stil',
+    title = localize('title'),
     cls = 'control overflow-hidden hidden',
     css = '',
     viewer,
@@ -384,11 +389,11 @@ const Stylewindow = function Stylewindow(optOptions = {}) {
           stroke
         });
         if (newStyleObj.showMeasureSegments) {
-          const segmentLabelStyle = drawStyles.getSegmentLabelStyle({ line: geom, projection, scale: styleScale });
+          const segmentLabelStyle = drawStyles.getSegmentLabelStyle({ line: geom, projection, scale: styleScale, localization });
           style = style.concat(segmentLabelStyle);
         }
         if (newStyleObj.showMeasure) {
-          const label = drawStyles.formatLength(geom, projection);
+          const label = drawStyles.formatLength({ line: geom, projection, localization });
           const point = new Point(geom.getLastCoordinate());
           const labelStyle = drawStyles.getLabelStyle(styleScale);
           labelStyle.setGeometry(point);
@@ -404,7 +409,7 @@ const Stylewindow = function Stylewindow(optOptions = {}) {
           const featureCoords = feature.getGeometry().getCoordinates();
           featureCoords.forEach(part => {
             const line = new LineString(part);
-            const segmentLabelStyle = drawStyles.getSegmentLabelStyle({ line, projection, scale: styleScale });
+            const segmentLabelStyle = drawStyles.getSegmentLabelStyle({ line, projection, scale: styleScale, localization });
             style = style.concat(segmentLabelStyle);
           });
         }
@@ -412,7 +417,7 @@ const Stylewindow = function Stylewindow(optOptions = {}) {
           const featureCoords = feature.getGeometry().getCoordinates();
           featureCoords.forEach(part => {
             const line = new LineString(part);
-            const label = drawStyles.formatLength(line, projection);
+            const label = drawStyles.formatLength({ line, projection, localization });
             const point = new Point(line.getLastCoordinate());
             const labelStyle = drawStyles.getLabelStyle(styleScale);
             labelStyle.setGeometry(point);
@@ -429,14 +434,14 @@ const Stylewindow = function Stylewindow(optOptions = {}) {
         if (newStyleObj.showMeasureSegments) {
           const radius = geom.getRadius();
           const circ = radius * 2 * Math.PI;
-          const label = formatLengthString(circ, { decimals: 2 });
+          const label = formatLengthString(circ, { decimals: 2, localization });
           const labelStyle = drawStyles.getBufferLabelStyle(label, styleScale);
           style = style.concat(labelStyle);
         }
         if (newStyleObj.showMeasure) {
           const radius = geom.getRadius();
           const area = radius * radius * Math.PI;
-          const label = drawStyles.formatArea(undefined, true, projection, area);
+          const label = drawStyles.formatArea({ useHectare: true, projection, featureArea: area, localization });
           const point = new Point(geom.getCenter());
           const labelStyle = drawStyles.getLabelStyle(styleScale);
           labelStyle.setGeometry(point);
@@ -451,11 +456,11 @@ const Stylewindow = function Stylewindow(optOptions = {}) {
         });
         if (newStyleObj.showMeasureSegments) {
           const line = new LineString(geom.getCoordinates()[0]);
-          const segmentLabelStyle = drawStyles.getSegmentLabelStyle({ line, projection, scale: styleScale });
+          const segmentLabelStyle = drawStyles.getSegmentLabelStyle({ line, projection, scale: styleScale, localization });
           style = style.concat(segmentLabelStyle);
         }
         if (newStyleObj.showMeasure) {
-          const label = drawStyles.formatArea(geom, true, projection);
+          const label = drawStyles.formatArea({ polygon: geom, useHectare: true, projection, localization });
           const point = geom.getInteriorPoint();
           const labelStyle = drawStyles.getLabelStyle(styleScale);
           labelStyle.setGeometry(point);
@@ -482,7 +487,7 @@ const Stylewindow = function Stylewindow(optOptions = {}) {
           const featureCoords = feature.getGeometry().getCoordinates();
           featureCoords.forEach(parts => {
             const polygon = new Polygon(parts);
-            const label = drawStyles.formatArea(polygon, true, projection);
+            const label = drawStyles.formatArea({ polygon, useHectare: true, projection, localization });
             const point = polygon.getInteriorPoint();
             const labelStyle = drawStyles.getLabelStyle(styleScale);
             labelStyle.setGeometry(point);
@@ -719,7 +724,7 @@ const Stylewindow = function Stylewindow(optOptions = {}) {
 
       contentEl = Element({
         cls: 'o-draw-stylewindow-content overflow-auto',
-        innerHTML: `${styleTemplate(palette, swStyle)}`
+        innerHTML: `${styleTemplate({ palette, swStyle, localization })}`
       });
 
       this.addComponent(headerEl);
diff --git a/src/utils/formatlengthstring.js b/src/utils/formatlengthstring.js
index 616898f73..7a33dcaf1 100644
--- a/src/utils/formatlengthstring.js
+++ b/src/utils/formatlengthstring.js
@@ -5,7 +5,8 @@
  */
 function formatLengthString(length, opts = {}) {
   const {
-    decimals
+    decimals,
+    localization
   } = opts;
   let result = length;
   let unit = 'm';
@@ -16,6 +17,8 @@ function formatLengthString(length, opts = {}) {
 
   if (decimals !== undefined) {
     result = result.toFixed(decimals);
+    const localeNumberFormat = new Intl.NumberFormat(localization?.getCurrentLocaleId());
+    result = localeNumberFormat.format(result);
   }
   const retstr = `${result} ${unit}`;
   return retstr;
diff --git a/src/viewer.js b/src/viewer.js
index 0414a9986..b77826728 100644
--- a/src/viewer.js
+++ b/src/viewer.js
@@ -567,7 +567,7 @@ const Viewer = function Viewer(targetOption, options = {}) {
       }));
 
       tileGrid = maputils.tileGrid(tileGridSettings);
-      stylewindow = Stylewindow({ palette, viewer: this });
+      stylewindow = Stylewindow({ palette, viewer: this, localization: controls.find((control) => control.name === 'localization') });
 
       setMap(Map(Object.assign(options, { projection, center, zoom, target: this.getId() })));