A dark mode for OSM Liberty, the Mapbox GL basemap style for the OpenMapTiles schema.

You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

Go to file

lukasmartinelli 4578fd2146 Add logo		8 years ago
demo	Add demo images	8 years ago
fonts	Add roboto font	8 years ago
sprites	Add sprites	8 years ago
.gitignore	Initial commit	8 years ago
CNAME	Add cname	8 years ago
LICENSE.md	Add license file	8 years ago
README.md	Add logo	8 years ago
_config.yml	Add license file	8 years ago
iconset.json	Add icon set	8 years ago
index.html	Add license file	8 years ago
logo.png	Add logo	8 years ago
osm-liberty.json	Add sprites and glyphs directly from page	8 years ago

README.md

OSM Liberty

A free Mapbox GL basemap for everyone with complete liberty to use and self host. OSM Liberty is a fork of OSM Bright based on free data sources with a mission for a clear good looking design for the everyday user.

osm-liberty.lukasmartinelli.ch

Usage

You can instantly use the style in your Mapbox GL maps. The vector tiles are served from the @klokantech public CDN and the raster tiles, glyphs and sprites directly from GitHub. Take a look at the demo page source code how to display a map. To use it you don't need any access keys and you can host the tiles and assets yourself for complete liberty.

<!DOCTYPE html>
<html>
<head>
  <meta charset=utf-8 />
  <title>OSM Liberty</title>
  <meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
  <style>
    body { margin:0; padding:0; }
    #map { position:absolute; top:0; bottom:0; width:100%; }
  </style>
  <script src='https://api.tiles.mapbox.com/mapbox-gl-js/v0.21.0/mapbox-gl.js'></script>
  <link href='https://api.tiles.mapbox.com/mapbox-gl-js/v0.21.0/mapbox-gl.css' rel='stylesheet' />
</head>
<body>
  <div id='map'></div>
  <script>
  var map = new mapboxgl.Map({
      container: 'map',
      style: 'http://osm-liberty.lukasmartinelli.ch/osm-liberty.json',
      center: [8.538961,47.372476],
      zoom: 5,
      hash: true
  });
  </script>
</body>
</html>

Data Sources

OSM2VectorTiles as vector data source
Natural Earth Tiles for relief shading
Maki as icon set

Map Design

The map design originates from OSM Bright but strives to reach a unobtrusive and clean design for everyday use. Colored relief shading from Natural Earth make the low zoom levels look good.

Modify Style

You can directly modify the style with the help of the mapbox-gl-style-editor.

Icon Design

A Maki icon set using colors to distinguish between icon categories.

Color Palette

Color Name	Hex Value
Blue	`#5d60be`
Light Blue	`#4898ff`
Orange	`#d97200`
Red	`#ba3827`
Brown	`#725a50`
Green	`#76a723`

Modify Icons

Take the style JSON file and upload it to the Maki Editor.
Apply your changes and download the icon set again.
Ensure you format the JSON first with cat iconset.json | jq -MS '.'