The Heroicons battery 100 icon depicts a fully charged battery and is typically used to indicate a device has maximum power or is fully charged.
Common uses
- Displaying full battery status
- Indicating a completed charging process
- Representing a device with optimal power
Use it in React
Install
npm i @heroicons/reactImport & render
import { Battery100Icon } from '@heroicons/react/24/outline';
<Battery100Icon className="size-6" />Styles
Heroicons ships this icon in 4 styles — each its own import:
24/outline
<Battery100Icon className="size-6" />24/solid
<Battery100Icon className="size-6" />20/solid
<Battery100Icon className="size-6" />16/solid
<Battery100Icon className="size-6" />Details
- Library
- Heroicons (324 icons)
- License
- MIT
- viewBox
0 0 24 24- Keywords
- battery100full batterycharged batterypower fullbattery full
FAQ
- What does the battery 100 icon represent?
- It represents a battery that is at 100% charge, meaning it is fully powered.
- How do I use the battery 100 icon in React?
- You can import it using: import { Battery100Icon } from '@heroicons/react/24/outline'
- What is the license for this icon?
- The Heroicons battery 100 icon is available under the MIT license.
Related icons
The same idea in other libraries, and near matches in Heroicons.
Looking for something else? Search Heroicons and 4 more libraries by description →
The search behind these pages runs as a Claude Code skill. What skills are and how I ship them →