diff --git a/web/app/sketcher/shapes/origin.js b/web/app/sketcher/shapes/origin.js
new file mode 100644
index 00000000..fdf34a11
--- /dev/null
+++ b/web/app/sketcher/shapes/origin.js
@@ -0,0 +1,33 @@
+/** @constructor */
+export function ReferencePointTool(viewer) {
+  this.viewer = viewer;
+}
+
+ReferencePointTool.prototype.keydown = function(e) {};
+ReferencePointTool.prototype.keypress = function(e) {};
+ReferencePointTool.prototype.keyup = function(e) {};
+
+ReferencePointTool.prototype.cleanup = function(e) {
+  this.viewer.cleanSnap();
+};
+
+ReferencePointTool.prototype.mousemove = function(e) {
+  var p = this.viewer.screenToModel(e);
+  this.viewer.snap(p.x, p.y, []);
+  this.viewer.refresh();
+};
+
+ReferencePointTool.prototype.mouseup = function(e) {
+};
+
+ReferencePointTool.prototype.mousedown = function(e) {
+  const needSnap = this.viewer.snapped.length != 0;
+  let p = needSnap ? this.viewer.snapped.pop() : this.viewer.screenToModel(e);
+  this.viewer.referencePoint.x = p.x;
+  this.viewer.referencePoint.y = p.y;
+  this.viewer.refresh();
+  this.viewer.toolManager.releaseControl();
+};
+
+ReferencePointTool.prototype.mousewheel = function(e) {
+};
diff --git a/web/app/sketcher/sketcher-app.js b/web/app/sketcher/sketcher-app.js
index 65f532cf..8e188d27 100644
--- a/web/app/sketcher/sketcher-app.js
+++ b/web/app/sketcher/sketcher-app.js
@@ -6,6 +6,7 @@ import {AddPointTool, AddSegmentTool} from './shapes/segment'
 import {AddArcTool} from './shapes/arc'
 import {EditCircleTool} from './shapes/circle'
 import {FilletTool} from './helpers'
+import {ReferencePointTool} from './shapes/origin'
 import $ from '../../lib/jquery-2.1.0.min'
 
 /** @constructor */
@@ -91,6 +92,10 @@ function App2D() {
     app.viewer.historyManager.checkpoint();
   });
 
+  this.registerAction('referencePoint', "Set Reference Point", function () {
+    app.viewer.toolManager.takeControl(new ReferencePointTool(app.viewer));
+  });
+
   this.registerAction('addPoint', "Add Point", function () {
     app.viewer.toolManager.takeControl(new AddPointTool(app.viewer));
   });
diff --git a/web/app/sketcher/viewer2d.js b/web/app/sketcher/viewer2d.js
index 4aada723..bd3ce18e 100644
--- a/web/app/sketcher/viewer2d.js
+++ b/web/app/sketcher/viewer2d.js
@@ -114,6 +114,8 @@ function Viewer(canvas, IO) {
   this.selected = [];
   this.snapped = [];
   
+  this.referencePoint = new ReferencePoint();
+  
   this._setupServiceLayer();
 
   this.historyManager = new HistoryManager(this);
@@ -212,6 +214,7 @@ Viewer.prototype._setupServiceLayer = function() {
   var layer = new Layer("_service", Styles.SERVICE);
 //  layer.objects.push(new CrossHair(0, 0, 20));
   layer.objects.push(new BasisOrigin(null, this));
+  layer.objects.push(this.referencePoint);
   layer.objects.push(new Point(0, 0, 2));
   this._serviceLayers.push(layer);
 
@@ -784,6 +787,28 @@ BasisOrigin.prototype.draw = function(ctx, scale) {
   ctx.restore();
 };
 
+
+/** @constructor */
+function ReferencePoint(viewer) {
+  this.viewer = viewer;
+  this.x = 0;
+  this.y = 0;
+}
+
+ReferencePoint.prototype.draw = function(ctx, scale) {
+  ctx.strokeStyle  = 'salmon';
+  ctx.fillStyle  = 'salmon';
+  ctx.lineWidth = 1 / scale;
+  
+  ctx.beginPath();
+  ctx.arc(this.x, this.y, 1 / scale, 0, 2 * Math.PI, false);
+  ctx.fill();
+
+  ctx.beginPath();
+  ctx.arc(this.x, this.y, 7 / scale, 0, 2 * Math.PI, false);
+  ctx.stroke();
+};
+
 /** @constructor */
 function ToolManager(viewer, defaultTool) {
   this.defaultTool = defaultTool;
diff --git a/web/sketcher.html b/web/sketcher.html
index 9f07802e..ddcff53a 100644
--- a/web/sketcher.html
+++ b/web/sketcher.html
@@ -23,6 +23,7 @@
     --><button class="btn tbtn act-export sep" ><i class="fa fa-upload"></i></button><!--
     --><button class="btn tbtn act-fit" ><i class="fa fa-globe"></i></button><!--
     --><button class="btn tbtn act-pan sep" ><i class="fa fa-arrows"></i></button><!--
+    --><button class="btn tbtn act-referencePoint"  type="submit" value="">O</button><!--
     --><button class="btn tbtn act-addPoint" style="background-image: url(img/dot.png);" type="submit" value=""></button><!--
     --><button class="btn tbtn act-addSegment" style="background-image: url(img/line.png);" type="submit" value=""></button><!--
     --><button class="btn tbtn act-addMultiSegment" style="background-image: url(img/mline.png);" type="submit" value=""></button><!--
diff --git a/webpack.config.js b/webpack.config.js
index ee568699..58a9ac69 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -4,8 +4,8 @@ const webpack = require('webpack');
 module.exports = {
   devtool: 'source-map',
   entry: {
-    index: ['./web/app/index', 'webpack-dev-server/client?http://localhost:3000', 'webpack/hot/only-dev-server' ],
-    sketcher: ['./web/app/sketcher', 'webpack-dev-server/client?http://localhost:3000', 'webpack/hot/only-dev-server' ]
+    index: ['./web/app/index'],
+    sketcher: ['./web/app/sketcher']
   },
   output: {
     path: path.join(__dirname, 'dist'),