Leaflet marker with a custom icon

This tutorial shows how to define your custom icons for markers using Leaflet JS.

Introducing custom images and shadows to your markers can significantly enhance the visual appeal of your map. By adding a personal touch to your Leaflet icons, you can create a unique and engaging experience for your users.




Replace YOUR_MAPTILER_API_KEY_HERE with your actual MapTiler API key.



Learn more



Check out the How to make a map with pins using Leaflet to learn How to load a geoJSON of points in Leaflet JS and add your custom pins or icons.



Related examples




    
    
    
    
    

        
          
            
            Display a Marker on the map using Leaflet
          
          
Display Marker

          Example
          
Display a Marker on the Map: this tutorial shows how to add the default Marker to the map using Leaflet JS.

        
      

    
    

        
          
            
            How to make a map with pins using Leaflet
          
          
Make a map with pins

          Example
          
This tutorial shows how to make a map with pins using Leaflet JS.