Skip to content

Driving range icon

Range: distance the vehicle can drive on its battery charge

Driving range: EVicons outline icon
On a light background
On a dark background

Sizes

  • 16
  • 20
  • 24
  • 32
  • 48

Use it

Install

Shell
npm i @evicons/react

React

TSX
import { DrivingRange } from '@evicons/react'

<DrivingRange size={24} title="Driving range" />

SVG

SVG
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" viewBox="0 0 24 24">
  <path d="M2.75 21 8.5 5"/>
  <path d="M19.25 21 13.5 5"/>
  <path d="M11 20v-4m0-3v-2.5"/>
  <path d="M20.75 2.5 18 6h1.5L19 9l3-4h-1.75Z"/>
</svg>

Sprite

HTML
<!-- Copy sprite.svg from @evicons/svg to your app's public folder -->
<svg width="24" height="24" aria-hidden="true"><use href="/sprite.svg#evicon-driving-range" /></svg>

Icons supplement text, they do not replace it. Without a visible label, give the icon a title or an aria-label. Read the docs

Details

React component
DrivingRange
SVG file
driving-range.svg
Category
Vehicles
Since version
0.2.0
Search terms
range, driving range, distance, road, km, reichweite, strecke, straße

MIT licence: free for commercial apps too. No credit needed in the UI; keep the licence file in your code.

More vehicles