diff --git a/README.md b/README.md
index 11d95551..0b66ae57 100644
--- a/README.md
+++ b/README.md
@@ -1,9 +1,9 @@
-# Mapolo
+# Mapital
 
-<img width="200" align="right" alt="Mapolo" src="mapolo.png" />
+<img width="200" align="right" alt="Mapital" src="mapolo.png" />
 
 A free and open visual editor for the [Mapbox GL styles](https://www.mapbox.com/mapbox-gl-style-spec/)
-targeted at developers and map designers. Creating your own custom map is easy with **Mapolo**.
+targeted at developers and map designers. Creating your own custom map is easy with **Mapital**.
 
 ## Reasons for building a Mapbox GL Style Editor
 
@@ -40,7 +40,7 @@ This is why I think we should rally behind and build our own style editor for th
 
 ## Develop
 
-Mapolo is written in ES6 and is using [React](https://github.com/facebook/react), [Immutable.js](https://facebook.github.io/immutable-js/) and [Mapbox GL JS](https://www.mapbox.com/mapbox-gl-js/api/).
+Mapital is written in ES6 and is using [React](https://github.com/facebook/react), [Immutable.js](https://facebook.github.io/immutable-js/) and [Mapbox GL JS](https://www.mapbox.com/mapbox-gl-js/api/).
 
 Install the deps, start the dev server and open the web browser on `http://localhost:8888/`.
 
diff --git a/mapolo.png b/mapital.png
similarity index 100%
rename from mapolo.png
rename to mapital.png
diff --git a/package.json b/package.json
index 4981c1a7..457c42de 100644
--- a/package.json
+++ b/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "mapolo",
+  "name": "mapital",
   "version": "0.0.1",
   "description": "A MapboxGL visual style editor",
   "main": "''",
diff --git a/src/fields/color.jsx b/src/fields/color.jsx
index 735112d4..8704cfa5 100644
--- a/src/fields/color.jsx
+++ b/src/fields/color.jsx
@@ -12,7 +12,8 @@ static propTypes = {
   }
 
 	onChange(e) {
-		return this.props.onChange(e.target.value)
+		const value = e.target.value
+		return this.props.onChange(value === "" ? null: value)
 	}
 
 	render() {
@@ -22,7 +23,7 @@ static propTypes = {
 				style={inputStyle.input}
 				name={this.props.name}
 				placeholder={this.props.default}
-				value={this.props.value}
+				value={this.props.value ? this.props.value : ""}
 				onChange={this.onChange.bind(this)}
 			/>
 		</div>
diff --git a/src/fields/number.jsx b/src/fields/number.jsx
index 77f2a4a4..942c2f66 100644
--- a/src/fields/number.jsx
+++ b/src/fields/number.jsx
@@ -15,7 +15,12 @@ class NumberField extends React.Component {
   }
 
 	onChange(e) {
-		return this.props.onChange(parseFloat(e.target.value))
+		const value = parseFloat(e.target.value)
+		/*TODO: we can do range validation already here?
+		if(this.props.min && value < this.props.min) return
+		if(this.props.max && value > this.props.max) return
+		*/
+		this.props.onChange(value)
 	}
 
 	render() {
diff --git a/src/fields/string.jsx b/src/fields/string.jsx
index 6e5e05d8..fb400a50 100644
--- a/src/fields/string.jsx
+++ b/src/fields/string.jsx
@@ -12,7 +12,8 @@ static propTypes = {
   }
 
 	onChange(e) {
-		return this.props.onChange(e.target.value)
+		const value = e.target.value
+		return this.props.onChange(value === "" ? null: value)
 	}
 
 render() {
diff --git a/src/layers/editor.jsx b/src/layers/editor.jsx
index 95612122..bae0c2cf 100644
--- a/src/layers/editor.jsx
+++ b/src/layers/editor.jsx
@@ -136,7 +136,7 @@ export class LayerEditor extends React.Component {
 				borderRight: 0,
 				borderStyle: "solid",
 				borderColor: theme.borderColor,
-				borderLeftColor: this.props.layer.getIn(['metadata', 'mapolo:color'])
+				borderLeftColor: this.props.layer.getIn(['metadata', 'mapital:color'])
 			}}>
 			<Toolbar onClick={this.toggleLayer.bind(this)}>
 				<NavItem style={{fontWeight: 400}}>
diff --git a/src/map.jsx b/src/map.jsx
index d42c32bf..df3969e5 100644
--- a/src/map.jsx
+++ b/src/map.jsx
@@ -3,6 +3,7 @@ import MapboxGl from 'mapbox-gl';
 import { fullHeight } from './theme.js'
 import style from './style.js'
 import Immutable from 'immutable'
+import validateColor from 'mapbox-gl-style-spec/lib/validate/validate_color'
 
 export class Map extends React.Component {
 	static propTypes = {
@@ -26,6 +27,15 @@ export class Map extends React.Component {
 		// TODO: If there is no map yet we need to apply the changes later?
 		if(this.state.map) {
 			style.diffStyles(this.props.mapStyle, nextProps.mapStyle).forEach(change => {
+
+				//TODO: Invalid outline color can cause map to freeze?
+				if(change.command === "setPaintProperty" && change.args[1] === "fill-outline-color" ) {
+					const value = change.args[2]
+					if(validateColor({value}).length > 0) {
+						return
+					}
+				}
+
 				console.log(change.command, ...change.args)
 				this.state.map[change.command].apply(this.state.map, change.args);
 			});
diff --git a/src/style.js b/src/style.js
index a38f2b9b..23870009 100644
--- a/src/style.js
+++ b/src/style.js
@@ -62,8 +62,8 @@ export function colorizeLayers(layers) {
 		if(!layer.metadata) {
 			layer.metadata = {}
 		}
-		if(!"mapolo:color" in layer.metadata) {
-			layer.metadata["mapolo:color"] = randomColor()
+		if(!"mapital:color" in layer.metadata) {
+			layer.metadata["mapital:color"] = randomColor()
 		}
 	  return layer
 	})
diff --git a/src/stylestore.js b/src/stylestore.js
index 7101ae3c..9eeb161b 100644
--- a/src/stylestore.js
+++ b/src/stylestore.js
@@ -2,7 +2,7 @@ import { colorizeLayers } from './style.js'
 import Immutable from 'immutable'
 import style from './style.js'
 
-const storagePrefix = "mapolo"
+const storagePrefix = "mapital"
 const storageKeys = {
 	latest: [storagePrefix, 'latest_style'].join(''),
 	accessToken: [storagePrefix, 'access_token'].join('')