--- layout: api title: "v2.2.2 JavaScript Library: L.DivIcon" categories: api version: v2.2.2 permalink: /api/v2.2.2/l-divicon ---

## DivIcon

Represents a lightweight icon for markers that uses a simple `div` element instead of an image.

    var myIcon = L.divIcon({className: 'my-div-icon'});
    // you can set .my-div-icon styles in CSS

    L.marker([50.505, 30.57], {icon: myIcon}).addTo(map);

By default, it has a `'leaflet-div-icon'` class and is styled as a little white square with a shadow.

### Creation

Factory | Description
--- | ---
`L.divIcon( <DivIcon options> options )` | Creates a div icon instance with the given options.

### Options

Option | Type | Description
--- | --- | ---
`iconSize` | `Point` | Size of the icon in pixels. Can be also set through CSS.
`iconAnchor` | `Point` | The coordinates of the "tip" of the icon (relative to its top left corner). The icon will be aligned so that this point is at the marker's geographical location. Centered by default if size is specified, also can be set in CSS with negative margins.
`className` | `String` | A custom class name to assign to the icon. `'leaflet-div-icon'` by default.
`html` | `String` | A custom HTML code to put inside the div element, empty by default.