<commit_before>---
title: Maki | A clean point of interest icon set from MapBox
layout: default
---
<link rel='stylesheet' href='{{site.baseurl}}/www/site.css' type='text/css'/>
<link rel='stylesheet' href='{{site.baseurl}}/www/maki-sprite.css' type='text/css'/>

<div id='maki'>
  <div id='maki-hero'>
    <div class='limiter clearfix content'>
      <div class='col-1 bordered-centered'>
        <h1><a href='{{site.url}}/maki' class='icon maki'>Maki Icons</a></h1>
        <a href='https://nodeload.github.com/mapbox/maki/zipball/gh-pages' class='download'>
          <span class='fr icon download'>&nbsp;</span>
          <span class='filename'>Maki.zip</span><br />
          <small>225kb</small>
        </a>
      </div>
      <div class='col-3'>
        <h2 class='tagline'>A clean point of interest icon set made for web cartography.</h2>
      </div>
    </div>
  </div> 
  
  <!-- /#maki-hero-->
  <div id='maki-subtitle'>
    <div class='limiter clip'>
      <script type='text-template' id='count'>
        <strong><%= setcount %></strong> different symbols at <strong>3</strong> sizes each. <strong><%= totalcount %></strong> total icons and growing.
      </script>
      Maki includes <span class='count'></span>
    </div>
  </div>

  <div class='canvas'>
    <div class='limiter clearfix content'>
      <script type='text/template' id='icon-collection'>
        <ul class='icon-set clearfix'>
          <li class='icon <%= icon%>'>Icon</li>
          <li class='title-box'><%= title%><small><%= icon %></small></li>
        </ul>
      </script>
      <div id='maki-set' class='clearfix'></div>
      <script type='text/template' id='search-icons'>
        <li>
          <ul class='icon-set clearfix'>
            <li class='icon <%=icon %>'><%=name %> icon</li>
          </ul><span class='title-box'><%=name %><small><%= icon %></small></span>
        </li>
      </script>
      <div id='search-results' class='limiter title clearfix'>
        <a href='#' class='icon close' title='Press ESC to close'>X</a>
        <div class='empty active'>No results found.</div>
        <ul id='results'></ul>
        <a href='https://nodeload.github.com/mapbox/maki/zipball/gh-pages' class='search-download'>Download Maki.zip</a>
      </div>
      <div class='canvas-controls'>
        <form id='search'>
          <input type='text' placeholder='e.g Golf or Bank'>
        </form>
      </div>
    </div>
  </div>

  <div class='overview'>
    <div class='limiter clip'>
      <div class='content prose clearfix'>
        
        <div class='clearfix maki-details'>
          <div class='col maki-thesis'>
            <h2>Designed pixel-by-pixel to look great at small sizes but scale up elegantly.</h2>
            <p>We designed Maki with the goal of creating an international, comprehensive, and stylistically unified point of interest icon set. In order to maximize crispness and clarity, we've made three size variations of each symbol. Use all three sizes to scale the icons with the map as you zoom in and out.</p>
          </div>
          
          <div id='maki-icon-preview' class='col'>
            <ul>
              <li><a href='#size-24' class='size-24 active'><span class="icon size-24">24px</span></a></li>
              <li><a href='#size-18' class='size-18'><span class="icon size-18">18px</span></a></li>
              <li><a href='#size-12' class='size-12'><span class="icon size-12">12px</span></a></li>
            </ul>
              <div class='preview-screen'>
              <img style='display: block;' class='size-24 active' src='{{site.baseurl}}/www/images/maki-preview-24.png' alt='' />
              <img style='display: none;' class='size-18' src='{{site.baseurl}}/www/images/maki-preview-18.png' alt='' />
              <img style='display: none;' class='size-12' src='{{site.baseurl}}/www/images/maki-preview-12.png' alt='' />
            </div>
          </div>
        </div>
        
        <div id='map'></div>

        <div class='clearfix'>
          <div class='col-1'>
            <div class='box tall'>
              <img src='{{site.baseurl}}/www/images/maki-universal.png' alt='' />
              <h3>Universal</h3>
              <p>Before beginning each icon, we look for a common symbol that has recognition across cultures.</p>
            </div>
          </div>
          <div class='col-1'>
            <div class='box tall'>
              <img src='{{site.baseurl}}/www/images/maki-madeformapping.png' alt='' />
              <h3>Made for Mapping</h3>
              <p>Size and simplicity are the top design priorities for Maki, so the icons will look clear but won't crowd your map.</p>
            </div>
          </div>
          <div class='col-1'>
            <div class='box tall'>
              <img src='{{site.baseurl}}/www/images/maki-legible.png' alt='' />
              <h3>Legible</h3>
              <p>All the icons include a subtle border so they stand out against complex or dark backgrounds.</p>
            </div>
          </div>
          <div class='col-1'>
            <div class='box tall'>
              <img src='{{site.baseurl}}/www/images/maki-opensource.png' alt='' />
              <h3>Open Source</h3>
              <p><a href='https://github.com/mapbox/maki'>Visit the GitHub repository</a> to fork, contribute, and provide feedback on Maki.</p>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  
    <div class='limiter clip'>
      <div class='content prose clearfix'>
        <div class='clearfix'>
          <div class='col-2'>
            <h3>Need help using Maki?</h3>
            
            <div class='helpnav clearfix'>
              <a href='http://mapbox.com/tilemill/docs/guides/using-maki-icons/'>Using Maki in TileMill</a>
              <a href='http://mapbox.com/tilemill/docs/guides/adding-colors-to-maki-icons/'>Recoloring Maki icons</a>
            </div>
          </div>
          
          <div class='col-2'>
            <h3>Download now</h3>
            <a href='https://nodeload.github.com/mapbox/maki/zipball/gh-pages' class='footerdownload clearfix'>
              <div class='download'>
                <span class='fr icon download'>&nbsp;</span>
                <span class='filename'>Maki.zip</span><br />
                <small>225kb</small>
              </div>
              <div class="description">Includes .PNG icons and the .SVG source</div>
            </a>
          </div>
        </div>
        
      </div>
    </div>
  </div>
</div>

<script src='{{site.baseurl}}/www/wax/modestmaps.min.js'></script>
<script src='{{site.baseurl}}/www/wax/wax.mm.min.js'></script>
<script src='{{site.baseurl}}/www/wax/deadsea.min.js'></script>
<script src='{{site.baseurl}}/www/site.js'></script>
<commit_msg>Add section key to YAML header.<commit_after>---
title: Maki | A clean point of interest icon set from MapBox
layout: default
section: maki
---
<link rel='stylesheet' href='{{site.baseurl}}/www/site.css' type='text/css'/>
<link rel='stylesheet' href='{{site.baseurl}}/www/maki-sprite.css' type='text/css'/>

<div id='maki'>
  <div id='maki-hero'>
    <div class='limiter clearfix content'>
      <div class='col-1 bordered-centered'>
        <h1><a href='{{site.url}}/maki' class='icon maki'>Maki Icons</a></h1>
        <a href='https://nodeload.github.com/mapbox/maki/zipball/gh-pages' class='download'>
          <span class='fr icon download'>&nbsp;</span>
          <span class='filename'>Maki.zip</span><br />
          <small>225kb</small>
        </a>
      </div>
      <div class='col-3'>
        <h2 class='tagline'>A clean point of interest icon set made for web cartography.</h2>
      </div>
    </div>
  </div> 
  
  <!-- /#maki-hero-->
  <div id='maki-subtitle'>
    <div class='limiter clip'>
      <script type='text-template' id='count'>
        <strong><%= setcount %></strong> different symbols at <strong>3</strong> sizes each. <strong><%= totalcount %></strong> total icons and growing.
      </script>
      Maki includes <span class='count'></span>
    </div>
  </div>

  <div class='canvas'>
    <div class='limiter clearfix content'>
      <script type='text/template' id='icon-collection'>
        <ul class='icon-set clearfix'>
          <li class='icon <%= icon%>'>Icon</li>
          <li class='title-box'><%= title%><small><%= icon %></small></li>
        </ul>
      </script>
      <div id='maki-set' class='clearfix'></div>
      <script type='text/template' id='search-icons'>
        <li>
          <ul class='icon-set clearfix'>
            <li class='icon <%=icon %>'><%=name %> icon</li>
          </ul><span class='title-box'><%=name %><small><%= icon %></small></span>
        </li>
      </script>
      <div id='search-results' class='limiter title clearfix'>
        <a href='#' class='icon close' title='Press ESC to close'>X</a>
        <div class='empty active'>No results found.</div>
        <ul id='results'></ul>
        <a href='https://nodeload.github.com/mapbox/maki/zipball/gh-pages' class='search-download'>Download Maki.zip</a>
      </div>
      <div class='canvas-controls'>
        <form id='search'>
          <input type='text' placeholder='e.g Golf or Bank'>
        </form>
      </div>
    </div>
  </div>

  <div class='overview'>
    <div class='limiter clip'>
      <div class='content prose clearfix'>
        
        <div class='clearfix maki-details'>
          <div class='col maki-thesis'>
            <h2>Designed pixel-by-pixel to look great at small sizes but scale up elegantly.</h2>
            <p>We designed Maki with the goal of creating an international, comprehensive, and stylistically unified point of interest icon set. In order to maximize crispness and clarity, we've made three size variations of each symbol. Use all three sizes to scale the icons with the map as you zoom in and out.</p>
          </div>
          
          <div id='maki-icon-preview' class='col'>
            <ul>
              <li><a href='#size-24' class='size-24 active'><span class="icon size-24">24px</span></a></li>
              <li><a href='#size-18' class='size-18'><span class="icon size-18">18px</span></a></li>
              <li><a href='#size-12' class='size-12'><span class="icon size-12">12px</span></a></li>
            </ul>
              <div class='preview-screen'>
              <img style='display: block;' class='size-24 active' src='{{site.baseurl}}/www/images/maki-preview-24.png' alt='' />
              <img style='display: none;' class='size-18' src='{{site.baseurl}}/www/images/maki-preview-18.png' alt='' />
              <img style='display: none;' class='size-12' src='{{site.baseurl}}/www/images/maki-preview-12.png' alt='' />
            </div>
          </div>
        </div>
        
        <div id='map'></div>

        <div class='clearfix'>
          <div class='col-1'>
            <div class='box tall'>
              <img src='{{site.baseurl}}/www/images/maki-universal.png' alt='' />
              <h3>Universal</h3>
              <p>Before beginning each icon, we look for a common symbol that has recognition across cultures.</p>
            </div>
          </div>
          <div class='col-1'>
            <div class='box tall'>
              <img src='{{site.baseurl}}/www/images/maki-madeformapping.png' alt='' />
              <h3>Made for Mapping</h3>
              <p>Size and simplicity are the top design priorities for Maki, so the icons will look clear but won't crowd your map.</p>
            </div>
          </div>
          <div class='col-1'>
            <div class='box tall'>
              <img src='{{site.baseurl}}/www/images/maki-legible.png' alt='' />
              <h3>Legible</h3>
              <p>All the icons include a subtle border so they stand out against complex or dark backgrounds.</p>
            </div>
          </div>
          <div class='col-1'>
            <div class='box tall'>
              <img src='{{site.baseurl}}/www/images/maki-opensource.png' alt='' />
              <h3>Open Source</h3>
              <p><a href='https://github.com/mapbox/maki'>Visit the GitHub repository</a> to fork, contribute, and provide feedback on Maki.</p>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  
    <div class='limiter clip'>
      <div class='content prose clearfix'>
        <div class='clearfix'>
          <div class='col-2'>
            <h3>Need help using Maki?</h3>
            
            <div class='helpnav clearfix'>
              <a href='http://mapbox.com/tilemill/docs/guides/using-maki-icons/'>Using Maki in TileMill</a>
              <a href='http://mapbox.com/tilemill/docs/guides/adding-colors-to-maki-icons/'>Recoloring Maki icons</a>
            </div>
          </div>
          
          <div class='col-2'>
            <h3>Download now</h3>
            <a href='https://nodeload.github.com/mapbox/maki/zipball/gh-pages' class='footerdownload clearfix'>
              <div class='download'>
                <span class='fr icon download'>&nbsp;</span>
                <span class='filename'>Maki.zip</span><br />
                <small>225kb</small>
              </div>
              <div class="description">Includes .PNG icons and the .SVG source</div>
            </a>
          </div>
        </div>
        
      </div>
    </div>
  </div>
</div>

<script src='{{site.baseurl}}/www/wax/modestmaps.min.js'></script>
<script src='{{site.baseurl}}/www/wax/wax.mm.min.js'></script>
<script src='{{site.baseurl}}/www/wax/deadsea.min.js'></script>
<script src='{{site.baseurl}}/www/site.js'></script>

{'fraction_non_alphanumeric': 0.1804799057853673, 'fraction_numerical': 0.01015751508906227, 'mean_word_length': 2.19468610392664, 'pattern_counts': {'":': 0, '<': 441, '<?xml version=': 0, '>': 441, 'https://': 8, 'lorem ipsum': 0, 'www.': 26, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 16, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2033463', 'n_tokens_mistral': 4433, 'n_tokens_neox': 4271, 'n_words': 999}