# charging-pad icon

Charging pad. Gentleface icon, drawn on the 16 px pixel grid. Free, MIT licensed. Page: https://gentleface.com/icons/charging-pad

- Category: Devices & hardware
- Use it for: wireless charging, charging pad, wireless charger, qi charging
- Tags: wireless-charging, charging-pad, qi, charger, charging, power, wireless
- Component name: ChargingPadIcon
- Added: 2026-11-12

## Alternatives

- `battery-charging`: the battery is charging, by any means (charging)

## Also fits

- battery charging: charging without a cable (wireless-charging)

## Files

Each icon is drawn on the 16 px grid, and most also on the 20 and 24 px grids (at 24 in three weights: light 1 px, regular 1.5 px, bold 2 px). Show the drawing made for your size, or an exact multiple of it, on whole pixels: 16 for 16 and 32 px, 20 for 20 and 40, 24 for 24 and 48. A size in between or a fractional position blurs it. The code on each icon page is the 16 px drawing, an SVG with fill="currentColor"; the icon page's downloads follow its Grid switch, and npm has the 20 and 24 px drawings too.

- line-round: https://gentleface.com/svg/line-round/16/charging-pad.svg · PNG https://gentleface.com/png/line-round/16/charging-pad.png · https://gentleface.com/png/line-round/32/charging-pad.png · https://gentleface.com/png/line-round/48/charging-pad.png
- line-soft: https://gentleface.com/svg/line-soft/16/charging-pad.svg · PNG https://gentleface.com/png/line-soft/16/charging-pad.png · https://gentleface.com/png/line-soft/32/charging-pad.png · https://gentleface.com/png/line-soft/48/charging-pad.png
- line-sharp: https://gentleface.com/svg/line-sharp/16/charging-pad.svg · PNG https://gentleface.com/png/line-sharp/16/charging-pad.png · https://gentleface.com/png/line-sharp/32/charging-pad.png · https://gentleface.com/png/line-sharp/48/charging-pad.png
- solid-round: https://gentleface.com/svg/solid-round/16/charging-pad.svg · PNG https://gentleface.com/png/solid-round/16/charging-pad.png · https://gentleface.com/png/solid-round/32/charging-pad.png · https://gentleface.com/png/solid-round/48/charging-pad.png
- solid-soft: https://gentleface.com/svg/solid-soft/16/charging-pad.svg · PNG https://gentleface.com/png/solid-soft/16/charging-pad.png · https://gentleface.com/png/solid-soft/32/charging-pad.png · https://gentleface.com/png/solid-soft/48/charging-pad.png
- solid-sharp: https://gentleface.com/svg/solid-sharp/16/charging-pad.svg · PNG https://gentleface.com/png/solid-sharp/16/charging-pad.png · https://gentleface.com/png/solid-sharp/32/charging-pad.png · https://gentleface.com/png/solid-sharp/48/charging-pad.png

The SVG of every style: https://gentleface.com/icons/charging-pad.json (`svg`).

## Code (line-round)

The snippets are decorative (aria-hidden). For an icon that carries meaning on its own, such as an icon-only button, label the button, or give the SVG role="img" and an aria-label. For another style, take its SVG from the JSON and swap the path `d`.

### SVG

```svg
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M8 1L8 5L10 5L9.546 5.757L9.546 5.757L7 10L7 6L5 6L8 1ZM5.242 11.108C5.968 11.036 6.721 11 7.5 11C8.279 11 9.032 11.036 9.758 11.108C10.552 11.186 11.254 11.302 11.864 11.454C12.576 11.632 13.11 11.85 13.466 12.108C13.822 12.365 14 12.663 14 13C14 13.337 13.822 13.635 13.466 13.892C13.11 14.15 12.576 14.368 11.864 14.546C11.254 14.698 10.552 14.814 9.758 14.892C9.032 14.964 8.279 15 7.5 15C6.721 15 5.968 14.964 5.242 14.892C4.448 14.814 3.746 14.698 3.136 14.546C2.424 14.368 1.89 14.15 1.534 13.892C1.178 13.635 1 13.337 1 13C1 12.663 1.178 12.365 1.534 12.108C1.89 11.85 2.424 11.632 3.136 11.454C3.746 11.302 4.448 11.186 5.242 11.108ZM3.379 13.576C3.941 13.716 4.595 13.823 5.341 13.897C6.034 13.966 6.753 14 7.5 14C8.247 14 8.966 13.966 9.659 13.897C10.405 13.823 11.059 13.716 11.621 13.576C12.155 13.442 12.552 13.293 12.812 13.129C12.886 13.082 12.942 13.039 12.978 13C12.942 12.961 12.886 12.918 12.812 12.871C12.552 12.707 12.155 12.558 11.621 12.424C11.059 12.284 10.405 12.177 9.659 12.103C8.966 12.034 8.247 12 7.5 12C6.753 12 6.034 12.034 5.341 12.103C4.595 12.177 3.941 12.284 3.379 12.424C2.845 12.558 2.448 12.707 2.188 12.871C2.114 12.918 2.058 12.961 2.022 13C2.058 13.039 2.114 13.082 2.188 13.129C2.448 13.293 2.845 13.442 3.379 13.576Z"/></svg>
```

### React

```tsx
// Gentleface "charging-pad" (line-round), MIT. https://gentleface.com/icons/charging-pad
import type { SVGProps } from 'react';

export function ChargingPadIcon(props: SVGProps<SVGSVGElement>) {
  return (
    <svg xmlns="http://www.w3.org/2000/svg" width={16} height={16} viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" {...props}>
      <path d="M8 1L8 5L10 5L9.546 5.757L9.546 5.757L7 10L7 6L5 6L8 1ZM5.242 11.108C5.968 11.036 6.721 11 7.5 11C8.279 11 9.032 11.036 9.758 11.108C10.552 11.186 11.254 11.302 11.864 11.454C12.576 11.632 13.11 11.85 13.466 12.108C13.822 12.365 14 12.663 14 13C14 13.337 13.822 13.635 13.466 13.892C13.11 14.15 12.576 14.368 11.864 14.546C11.254 14.698 10.552 14.814 9.758 14.892C9.032 14.964 8.279 15 7.5 15C6.721 15 5.968 14.964 5.242 14.892C4.448 14.814 3.746 14.698 3.136 14.546C2.424 14.368 1.89 14.15 1.534 13.892C1.178 13.635 1 13.337 1 13C1 12.663 1.178 12.365 1.534 12.108C1.89 11.85 2.424 11.632 3.136 11.454C3.746 11.302 4.448 11.186 5.242 11.108ZM3.379 13.576C3.941 13.716 4.595 13.823 5.341 13.897C6.034 13.966 6.753 14 7.5 14C8.247 14 8.966 13.966 9.659 13.897C10.405 13.823 11.059 13.716 11.621 13.576C12.155 13.442 12.552 13.293 12.812 13.129C12.886 13.082 12.942 13.039 12.978 13C12.942 12.961 12.886 12.918 12.812 12.871C12.552 12.707 12.155 12.558 11.621 12.424C11.059 12.284 10.405 12.177 9.659 12.103C8.966 12.034 8.247 12 7.5 12C6.753 12 6.034 12.034 5.341 12.103C4.595 12.177 3.941 12.284 3.379 12.424C2.845 12.558 2.448 12.707 2.188 12.871C2.114 12.918 2.058 12.961 2.022 13C2.058 13.039 2.114 13.082 2.188 13.129C2.448 13.293 2.845 13.442 3.379 13.576Z" />
    </svg>
  );
}
```

### Vue

```vue
<!-- Gentleface "charging-pad" (line-round), MIT. https://gentleface.com/icons/charging-pad -->
<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true">
    <path d="M8 1L8 5L10 5L9.546 5.757L9.546 5.757L7 10L7 6L5 6L8 1ZM5.242 11.108C5.968 11.036 6.721 11 7.5 11C8.279 11 9.032 11.036 9.758 11.108C10.552 11.186 11.254 11.302 11.864 11.454C12.576 11.632 13.11 11.85 13.466 12.108C13.822 12.365 14 12.663 14 13C14 13.337 13.822 13.635 13.466 13.892C13.11 14.15 12.576 14.368 11.864 14.546C11.254 14.698 10.552 14.814 9.758 14.892C9.032 14.964 8.279 15 7.5 15C6.721 15 5.968 14.964 5.242 14.892C4.448 14.814 3.746 14.698 3.136 14.546C2.424 14.368 1.89 14.15 1.534 13.892C1.178 13.635 1 13.337 1 13C1 12.663 1.178 12.365 1.534 12.108C1.89 11.85 2.424 11.632 3.136 11.454C3.746 11.302 4.448 11.186 5.242 11.108ZM3.379 13.576C3.941 13.716 4.595 13.823 5.341 13.897C6.034 13.966 6.753 14 7.5 14C8.247 14 8.966 13.966 9.659 13.897C10.405 13.823 11.059 13.716 11.621 13.576C12.155 13.442 12.552 13.293 12.812 13.129C12.886 13.082 12.942 13.039 12.978 13C12.942 12.961 12.886 12.918 12.812 12.871C12.552 12.707 12.155 12.558 11.621 12.424C11.059 12.284 10.405 12.177 9.659 12.103C8.966 12.034 8.247 12 7.5 12C6.753 12 6.034 12.034 5.341 12.103C4.595 12.177 3.941 12.284 3.379 12.424C2.845 12.558 2.448 12.707 2.188 12.871C2.114 12.918 2.058 12.961 2.022 13C2.058 13.039 2.114 13.082 2.188 13.129C2.448 13.293 2.845 13.442 3.379 13.576Z" />
  </svg>
</template>
```

### Svelte

```svelte
<!-- Gentleface "charging-pad" (line-round), MIT. https://gentleface.com/icons/charging-pad -->
<script>
  let props = $props();
</script>

<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" {...props}>
  <path d="M8 1L8 5L10 5L9.546 5.757L9.546 5.757L7 10L7 6L5 6L8 1ZM5.242 11.108C5.968 11.036 6.721 11 7.5 11C8.279 11 9.032 11.036 9.758 11.108C10.552 11.186 11.254 11.302 11.864 11.454C12.576 11.632 13.11 11.85 13.466 12.108C13.822 12.365 14 12.663 14 13C14 13.337 13.822 13.635 13.466 13.892C13.11 14.15 12.576 14.368 11.864 14.546C11.254 14.698 10.552 14.814 9.758 14.892C9.032 14.964 8.279 15 7.5 15C6.721 15 5.968 14.964 5.242 14.892C4.448 14.814 3.746 14.698 3.136 14.546C2.424 14.368 1.89 14.15 1.534 13.892C1.178 13.635 1 13.337 1 13C1 12.663 1.178 12.365 1.534 12.108C1.89 11.85 2.424 11.632 3.136 11.454C3.746 11.302 4.448 11.186 5.242 11.108ZM3.379 13.576C3.941 13.716 4.595 13.823 5.341 13.897C6.034 13.966 6.753 14 7.5 14C8.247 14 8.966 13.966 9.659 13.897C10.405 13.823 11.059 13.716 11.621 13.576C12.155 13.442 12.552 13.293 12.812 13.129C12.886 13.082 12.942 13.039 12.978 13C12.942 12.961 12.886 12.918 12.812 12.871C12.552 12.707 12.155 12.558 11.621 12.424C11.059 12.284 10.405 12.177 9.659 12.103C8.966 12.034 8.247 12 7.5 12C6.753 12 6.034 12.034 5.341 12.103C4.595 12.177 3.941 12.284 3.379 12.424C2.845 12.558 2.448 12.707 2.188 12.871C2.114 12.918 2.058 12.961 2.022 13C2.058 13.039 2.114 13.082 2.188 13.129C2.448 13.293 2.845 13.442 3.379 13.576Z" />
</svg>
```

### HTML img

```html
<!-- Gentleface "charging-pad" (line-round), MIT. https://gentleface.com/icons/charging-pad. An <img> can't take currentColor: it draws black. Inline the SVG or use the CSS mask to color it. -->
<img src="https://gentleface.com/svg/line-round/16/charging-pad.svg" width="16" height="16" alt="">
```

### CSS

```css
/* Gentleface "charging-pad" (line-round), MIT. https://gentleface.com/icons/charging-pad. Takes the text color. */
.icon-charging-pad {
  display: inline-block;
  width: 16px;
  height: 16px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='currentColor'%3E%3Cpath d='M8 1L8 5L10 5L9.546 5.757L9.546 5.757L7 10L7 6L5 6L8 1ZM5.242 11.108C5.968 11.036 6.721 11 7.5 11C8.279 11 9.032 11.036 9.758 11.108C10.552 11.186 11.254 11.302 11.864 11.454C12.576 11.632 13.11 11.85 13.466 12.108C13.822 12.365 14 12.663 14 13C14 13.337 13.822 13.635 13.466 13.892C13.11 14.15 12.576 14.368 11.864 14.546C11.254 14.698 10.552 14.814 9.758 14.892C9.032 14.964 8.279 15 7.5 15C6.721 15 5.968 14.964 5.242 14.892C4.448 14.814 3.746 14.698 3.136 14.546C2.424 14.368 1.89 14.15 1.534 13.892C1.178 13.635 1 13.337 1 13C1 12.663 1.178 12.365 1.534 12.108C1.89 11.85 2.424 11.632 3.136 11.454C3.746 11.302 4.448 11.186 5.242 11.108ZM3.379 13.576C3.941 13.716 4.595 13.823 5.341 13.897C6.034 13.966 6.753 14 7.5 14C8.247 14 8.966 13.966 9.659 13.897C10.405 13.823 11.059 13.716 11.621 13.576C12.155 13.442 12.552 13.293 12.812 13.129C12.886 13.082 12.942 13.039 12.978 13C12.942 12.961 12.886 12.918 12.812 12.871C12.552 12.707 12.155 12.558 11.621 12.424C11.059 12.284 10.405 12.177 9.659 12.103C8.966 12.034 8.247 12 7.5 12C6.753 12 6.034 12.034 5.341 12.103C4.595 12.177 3.941 12.284 3.379 12.424C2.845 12.558 2.448 12.707 2.188 12.871C2.114 12.918 2.058 12.961 2.022 13C2.058 13.039 2.114 13.082 2.188 13.129C2.448 13.293 2.845 13.442 3.379 13.576Z'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='currentColor'%3E%3Cpath d='M8 1L8 5L10 5L9.546 5.757L9.546 5.757L7 10L7 6L5 6L8 1ZM5.242 11.108C5.968 11.036 6.721 11 7.5 11C8.279 11 9.032 11.036 9.758 11.108C10.552 11.186 11.254 11.302 11.864 11.454C12.576 11.632 13.11 11.85 13.466 12.108C13.822 12.365 14 12.663 14 13C14 13.337 13.822 13.635 13.466 13.892C13.11 14.15 12.576 14.368 11.864 14.546C11.254 14.698 10.552 14.814 9.758 14.892C9.032 14.964 8.279 15 7.5 15C6.721 15 5.968 14.964 5.242 14.892C4.448 14.814 3.746 14.698 3.136 14.546C2.424 14.368 1.89 14.15 1.534 13.892C1.178 13.635 1 13.337 1 13C1 12.663 1.178 12.365 1.534 12.108C1.89 11.85 2.424 11.632 3.136 11.454C3.746 11.302 4.448 11.186 5.242 11.108ZM3.379 13.576C3.941 13.716 4.595 13.823 5.341 13.897C6.034 13.966 6.753 14 7.5 14C8.247 14 8.966 13.966 9.659 13.897C10.405 13.823 11.059 13.716 11.621 13.576C12.155 13.442 12.552 13.293 12.812 13.129C12.886 13.082 12.942 13.039 12.978 13C12.942 12.961 12.886 12.918 12.812 12.871C12.552 12.707 12.155 12.558 11.621 12.424C11.059 12.284 10.405 12.177 9.659 12.103C8.966 12.034 8.247 12 7.5 12C6.753 12 6.034 12.034 5.341 12.103C4.595 12.177 3.941 12.284 3.379 12.424C2.845 12.558 2.448 12.707 2.188 12.871C2.114 12.918 2.058 12.961 2.022 13C2.058 13.039 2.114 13.082 2.188 13.129C2.448 13.293 2.845 13.442 3.379 13.576Z'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}
```

### Data URL

```text
data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='currentColor'%3E%3Cpath d='M8 1L8 5L10 5L9.546 5.757L9.546 5.757L7 10L7 6L5 6L8 1ZM5.242 11.108C5.968 11.036 6.721 11 7.5 11C8.279 11 9.032 11.036 9.758 11.108C10.552 11.186 11.254 11.302 11.864 11.454C12.576 11.632 13.11 11.85 13.466 12.108C13.822 12.365 14 12.663 14 13C14 13.337 13.822 13.635 13.466 13.892C13.11 14.15 12.576 14.368 11.864 14.546C11.254 14.698 10.552 14.814 9.758 14.892C9.032 14.964 8.279 15 7.5 15C6.721 15 5.968 14.964 5.242 14.892C4.448 14.814 3.746 14.698 3.136 14.546C2.424 14.368 1.89 14.15 1.534 13.892C1.178 13.635 1 13.337 1 13C1 12.663 1.178 12.365 1.534 12.108C1.89 11.85 2.424 11.632 3.136 11.454C3.746 11.302 4.448 11.186 5.242 11.108ZM3.379 13.576C3.941 13.716 4.595 13.823 5.341 13.897C6.034 13.966 6.753 14 7.5 14C8.247 14 8.966 13.966 9.659 13.897C10.405 13.823 11.059 13.716 11.621 13.576C12.155 13.442 12.552 13.293 12.812 13.129C12.886 13.082 12.942 13.039 12.978 13C12.942 12.961 12.886 12.918 12.812 12.871C12.552 12.707 12.155 12.558 11.621 12.424C11.059 12.284 10.405 12.177 9.659 12.103C8.966 12.034 8.247 12 7.5 12C6.753 12 6.034 12.034 5.341 12.103C4.595 12.177 3.941 12.284 3.379 12.424C2.845 12.558 2.448 12.707 2.188 12.871C2.114 12.918 2.058 12.961 2.022 13C2.058 13.039 2.114 13.082 2.188 13.129C2.448 13.293 2.845 13.442 3.379 13.576Z'/%3E%3C/svg%3E
```

### Sprite

```html
<!-- Gentleface "charging-pad" (line-round), MIT. https://gentleface.com/icons/charging-pad
     Every icon of this style in one file: https://gentleface.com/sprite/line-round.svg
     Serve it from your own origin: <use> does not load from another origin. -->
<svg width="16" height="16" aria-hidden="true"><use href="/sprite/line-round.svg#charging-pad"/></svg>
```

### SwiftUI

```swift
// Gentleface "charging-pad" (line-round), MIT. https://gentleface.com/icons/charging-pad
import SwiftUI

struct ChargingPadIcon: Shape {
    func path(in rect: CGRect) -> Path {
        var p = Path()
        p.move(to: CGPoint(x: 8, y: 1))
        p.addLine(to: CGPoint(x: 8, y: 5))
        p.addLine(to: CGPoint(x: 10, y: 5))
        p.addLine(to: CGPoint(x: 9.546, y: 5.757))
        p.addLine(to: CGPoint(x: 9.546, y: 5.757))
        p.addLine(to: CGPoint(x: 7, y: 10))
        p.addLine(to: CGPoint(x: 7, y: 6))
        p.addLine(to: CGPoint(x: 5, y: 6))
        p.addLine(to: CGPoint(x: 8, y: 1))
        p.closeSubpath()
        p.move(to: CGPoint(x: 5.242, y: 11.108))
        p.addCurve(to: CGPoint(x: 7.5, y: 11), control1: CGPoint(x: 5.968, y: 11.036), control2: CGPoint(x: 6.721, y: 11))
        p.addCurve(to: CGPoint(x: 9.758, y: 11.108), control1: CGPoint(x: 8.279, y: 11), control2: CGPoint(x: 9.032, y: 11.036))
        p.addCurve(to: CGPoint(x: 11.864, y: 11.454), control1: CGPoint(x: 10.552, y: 11.186), control2: CGPoint(x: 11.254, y: 11.302))
        p.addCurve(to: CGPoint(x: 13.466, y: 12.108), control1: CGPoint(x: 12.576, y: 11.632), control2: CGPoint(x: 13.11, y: 11.85))
        p.addCurve(to: CGPoint(x: 14, y: 13), control1: CGPoint(x: 13.822, y: 12.365), control2: CGPoint(x: 14, y: 12.663))
        p.addCurve(to: CGPoint(x: 13.466, y: 13.892), control1: CGPoint(x: 14, y: 13.337), control2: CGPoint(x: 13.822, y: 13.635))
        p.addCurve(to: CGPoint(x: 11.864, y: 14.546), control1: CGPoint(x: 13.11, y: 14.15), control2: CGPoint(x: 12.576, y: 14.368))
        p.addCurve(to: CGPoint(x: 9.758, y: 14.892), control1: CGPoint(x: 11.254, y: 14.698), control2: CGPoint(x: 10.552, y: 14.814))
        p.addCurve(to: CGPoint(x: 7.5, y: 15), control1: CGPoint(x: 9.032, y: 14.964), control2: CGPoint(x: 8.279, y: 15))
        p.addCurve(to: CGPoint(x: 5.242, y: 14.892), control1: CGPoint(x: 6.721, y: 15), control2: CGPoint(x: 5.968, y: 14.964))
        p.addCurve(to: CGPoint(x: 3.136, y: 14.546), control1: CGPoint(x: 4.448, y: 14.814), control2: CGPoint(x: 3.746, y: 14.698))
        p.addCurve(to: CGPoint(x: 1.534, y: 13.892), control1: CGPoint(x: 2.424, y: 14.368), control2: CGPoint(x: 1.89, y: 14.15))
        p.addCurve(to: CGPoint(x: 1, y: 13), control1: CGPoint(x: 1.178, y: 13.635), control2: CGPoint(x: 1, y: 13.337))
        p.addCurve(to: CGPoint(x: 1.534, y: 12.108), control1: CGPoint(x: 1, y: 12.663), control2: CGPoint(x: 1.178, y: 12.365))
        p.addCurve(to: CGPoint(x: 3.136, y: 11.454), control1: CGPoint(x: 1.89, y: 11.85), control2: CGPoint(x: 2.424, y: 11.632))
        p.addCurve(to: CGPoint(x: 5.242, y: 11.108), control1: CGPoint(x: 3.746, y: 11.302), control2: CGPoint(x: 4.448, y: 11.186))
        p.closeSubpath()
        p.move(to: CGPoint(x: 3.379, y: 13.576))
        p.addCurve(to: CGPoint(x: 5.341, y: 13.897), control1: CGPoint(x: 3.941, y: 13.716), control2: CGPoint(x: 4.595, y: 13.823))
        p.addCurve(to: CGPoint(x: 7.5, y: 14), control1: CGPoint(x: 6.034, y: 13.966), control2: CGPoint(x: 6.753, y: 14))
        p.addCurve(to: CGPoint(x: 9.659, y: 13.897), control1: CGPoint(x: 8.247, y: 14), control2: CGPoint(x: 8.966, y: 13.966))
        p.addCurve(to: CGPoint(x: 11.621, y: 13.576), control1: CGPoint(x: 10.405, y: 13.823), control2: CGPoint(x: 11.059, y: 13.716))
        p.addCurve(to: CGPoint(x: 12.812, y: 13.129), control1: CGPoint(x: 12.155, y: 13.442), control2: CGPoint(x: 12.552, y: 13.293))
        p.addCurve(to: CGPoint(x: 12.978, y: 13), control1: CGPoint(x: 12.886, y: 13.082), control2: CGPoint(x: 12.942, y: 13.039))
        p.addCurve(to: CGPoint(x: 12.812, y: 12.871), control1: CGPoint(x: 12.942, y: 12.961), control2: CGPoint(x: 12.886, y: 12.918))
        p.addCurve(to: CGPoint(x: 11.621, y: 12.424), control1: CGPoint(x: 12.552, y: 12.707), control2: CGPoint(x: 12.155, y: 12.558))
        p.addCurve(to: CGPoint(x: 9.659, y: 12.103), control1: CGPoint(x: 11.059, y: 12.284), control2: CGPoint(x: 10.405, y: 12.177))
        p.addCurve(to: CGPoint(x: 7.5, y: 12), control1: CGPoint(x: 8.966, y: 12.034), control2: CGPoint(x: 8.247, y: 12))
        p.addCurve(to: CGPoint(x: 5.341, y: 12.103), control1: CGPoint(x: 6.753, y: 12), control2: CGPoint(x: 6.034, y: 12.034))
        p.addCurve(to: CGPoint(x: 3.379, y: 12.424), control1: CGPoint(x: 4.595, y: 12.177), control2: CGPoint(x: 3.941, y: 12.284))
        p.addCurve(to: CGPoint(x: 2.188, y: 12.871), control1: CGPoint(x: 2.845, y: 12.558), control2: CGPoint(x: 2.448, y: 12.707))
        p.addCurve(to: CGPoint(x: 2.022, y: 13), control1: CGPoint(x: 2.114, y: 12.918), control2: CGPoint(x: 2.058, y: 12.961))
        p.addCurve(to: CGPoint(x: 2.188, y: 13.129), control1: CGPoint(x: 2.058, y: 13.039), control2: CGPoint(x: 2.114, y: 13.082))
        p.addCurve(to: CGPoint(x: 3.379, y: 13.576), control1: CGPoint(x: 2.448, y: 13.293), control2: CGPoint(x: 2.845, y: 13.442))
        p.closeSubpath()
        return p.applying(CGAffineTransform(scaleX: rect.width / 16, y: rect.height / 16))
    }
}

// ChargingPadIcon().frame(width: 16, height: 16) fills with the foreground style. Keep it on whole points to stay crisp.
```

### Compose

```kotlin
// Gentleface "charging-pad" (line-round), MIT. https://gentleface.com/icons/charging-pad
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.SolidColor
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.graphics.vector.addPathNodes
import androidx.compose.ui.unit.dp

val ChargingPadIcon: ImageVector by lazy {
    ImageVector.Builder(
        name = "charging-pad", defaultWidth = 16.dp, defaultHeight = 16.dp,
        viewportWidth = 16f, viewportHeight = 16f,
    ).addPath(
        pathData = addPathNodes("M8 1L8 5L10 5L9.546 5.757L9.546 5.757L7 10L7 6L5 6L8 1ZM5.242 11.108C5.968 11.036 6.721 11 7.5 11C8.279 11 9.032 11.036 9.758 11.108C10.552 11.186 11.254 11.302 11.864 11.454C12.576 11.632 13.11 11.85 13.466 12.108C13.822 12.365 14 12.663 14 13C14 13.337 13.822 13.635 13.466 13.892C13.11 14.15 12.576 14.368 11.864 14.546C11.254 14.698 10.552 14.814 9.758 14.892C9.032 14.964 8.279 15 7.5 15C6.721 15 5.968 14.964 5.242 14.892C4.448 14.814 3.746 14.698 3.136 14.546C2.424 14.368 1.89 14.15 1.534 13.892C1.178 13.635 1 13.337 1 13C1 12.663 1.178 12.365 1.534 12.108C1.89 11.85 2.424 11.632 3.136 11.454C3.746 11.302 4.448 11.186 5.242 11.108ZM3.379 13.576C3.941 13.716 4.595 13.823 5.341 13.897C6.034 13.966 6.753 14 7.5 14C8.247 14 8.966 13.966 9.659 13.897C10.405 13.823 11.059 13.716 11.621 13.576C12.155 13.442 12.552 13.293 12.812 13.129C12.886 13.082 12.942 13.039 12.978 13C12.942 12.961 12.886 12.918 12.812 12.871C12.552 12.707 12.155 12.558 11.621 12.424C11.059 12.284 10.405 12.177 9.659 12.103C8.966 12.034 8.247 12 7.5 12C6.753 12 6.034 12.034 5.341 12.103C4.595 12.177 3.941 12.284 3.379 12.424C2.845 12.558 2.448 12.707 2.188 12.871C2.114 12.918 2.058 12.961 2.022 13C2.058 13.039 2.114 13.082 2.188 13.129C2.448 13.293 2.845 13.442 3.379 13.576Z"),
        fill = SolidColor(Color.Black),
    ).build()
}

// Icon(ChargingPadIcon, contentDescription = null) tints it with LocalContentColor.
```

### Android XML

```xml
<!-- res/drawable/ic_charging_pad.xml · Gentleface "charging-pad" (line-round), MIT. https://gentleface.com/icons/charging-pad -->
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="16dp"
    android:height="16dp"
    android:viewportWidth="16"
    android:viewportHeight="16"
    android:tint="?attr/colorControlNormal">
  <path
      android:fillColor="@android:color/white"
      android:pathData="M8 1L8 5L10 5L9.546 5.757L9.546 5.757L7 10L7 6L5 6L8 1ZM5.242 11.108C5.968 11.036 6.721 11 7.5 11C8.279 11 9.032 11.036 9.758 11.108C10.552 11.186 11.254 11.302 11.864 11.454C12.576 11.632 13.11 11.85 13.466 12.108C13.822 12.365 14 12.663 14 13C14 13.337 13.822 13.635 13.466 13.892C13.11 14.15 12.576 14.368 11.864 14.546C11.254 14.698 10.552 14.814 9.758 14.892C9.032 14.964 8.279 15 7.5 15C6.721 15 5.968 14.964 5.242 14.892C4.448 14.814 3.746 14.698 3.136 14.546C2.424 14.368 1.89 14.15 1.534 13.892C1.178 13.635 1 13.337 1 13C1 12.663 1.178 12.365 1.534 12.108C1.89 11.85 2.424 11.632 3.136 11.454C3.746 11.302 4.448 11.186 5.242 11.108ZM3.379 13.576C3.941 13.716 4.595 13.823 5.341 13.897C6.034 13.966 6.753 14 7.5 14C8.247 14 8.966 13.966 9.659 13.897C10.405 13.823 11.059 13.716 11.621 13.576C12.155 13.442 12.552 13.293 12.812 13.129C12.886 13.082 12.942 13.039 12.978 13C12.942 12.961 12.886 12.918 12.812 12.871C12.552 12.707 12.155 12.558 11.621 12.424C11.059 12.284 10.405 12.177 9.659 12.103C8.966 12.034 8.247 12 7.5 12C6.753 12 6.034 12.034 5.341 12.103C4.595 12.177 3.941 12.284 3.379 12.424C2.845 12.558 2.448 12.707 2.188 12.871C2.114 12.918 2.058 12.961 2.022 13C2.058 13.039 2.114 13.082 2.188 13.129C2.448 13.293 2.845 13.442 3.379 13.576Z"/>
</vector>
```

### Flutter

```dart
// Gentleface "charging-pad" (line-round), MIT. https://gentleface.com/icons/charging-pad
import 'package:flutter/widgets.dart';

class ChargingPadIcon extends StatelessWidget {
  const ChargingPadIcon({super.key, this.size = 16, this.color});
  final double size;
  final Color? color;

  @override
  Widget build(BuildContext context) => CustomPaint(
        size: Size.square(size),
        painter: _ChargingPadIconPainter(color ?? IconTheme.of(context).color ?? const Color(0xFF000000)),
      );
}

class _ChargingPadIconPainter extends CustomPainter {
  _ChargingPadIconPainter(this.color);
  final Color color;

  @override
  void paint(Canvas canvas, Size size) {
    canvas.scale(size.width / 16, size.height / 16);
    final p = Path()
      ..moveTo(8, 1)
      ..lineTo(8, 5)
      ..lineTo(10, 5)
      ..lineTo(9.546, 5.757)
      ..lineTo(9.546, 5.757)
      ..lineTo(7, 10)
      ..lineTo(7, 6)
      ..lineTo(5, 6)
      ..lineTo(8, 1)
      ..close()
      ..moveTo(5.242, 11.108)
      ..cubicTo(5.968, 11.036, 6.721, 11, 7.5, 11)
      ..cubicTo(8.279, 11, 9.032, 11.036, 9.758, 11.108)
      ..cubicTo(10.552, 11.186, 11.254, 11.302, 11.864, 11.454)
      ..cubicTo(12.576, 11.632, 13.11, 11.85, 13.466, 12.108)
      ..cubicTo(13.822, 12.365, 14, 12.663, 14, 13)
      ..cubicTo(14, 13.337, 13.822, 13.635, 13.466, 13.892)
      ..cubicTo(13.11, 14.15, 12.576, 14.368, 11.864, 14.546)
      ..cubicTo(11.254, 14.698, 10.552, 14.814, 9.758, 14.892)
      ..cubicTo(9.032, 14.964, 8.279, 15, 7.5, 15)
      ..cubicTo(6.721, 15, 5.968, 14.964, 5.242, 14.892)
      ..cubicTo(4.448, 14.814, 3.746, 14.698, 3.136, 14.546)
      ..cubicTo(2.424, 14.368, 1.89, 14.15, 1.534, 13.892)
      ..cubicTo(1.178, 13.635, 1, 13.337, 1, 13)
      ..cubicTo(1, 12.663, 1.178, 12.365, 1.534, 12.108)
      ..cubicTo(1.89, 11.85, 2.424, 11.632, 3.136, 11.454)
      ..cubicTo(3.746, 11.302, 4.448, 11.186, 5.242, 11.108)
      ..close()
      ..moveTo(3.379, 13.576)
      ..cubicTo(3.941, 13.716, 4.595, 13.823, 5.341, 13.897)
      ..cubicTo(6.034, 13.966, 6.753, 14, 7.5, 14)
      ..cubicTo(8.247, 14, 8.966, 13.966, 9.659, 13.897)
      ..cubicTo(10.405, 13.823, 11.059, 13.716, 11.621, 13.576)
      ..cubicTo(12.155, 13.442, 12.552, 13.293, 12.812, 13.129)
      ..cubicTo(12.886, 13.082, 12.942, 13.039, 12.978, 13)
      ..cubicTo(12.942, 12.961, 12.886, 12.918, 12.812, 12.871)
      ..cubicTo(12.552, 12.707, 12.155, 12.558, 11.621, 12.424)
      ..cubicTo(11.059, 12.284, 10.405, 12.177, 9.659, 12.103)
      ..cubicTo(8.966, 12.034, 8.247, 12, 7.5, 12)
      ..cubicTo(6.753, 12, 6.034, 12.034, 5.341, 12.103)
      ..cubicTo(4.595, 12.177, 3.941, 12.284, 3.379, 12.424)
      ..cubicTo(2.845, 12.558, 2.448, 12.707, 2.188, 12.871)
      ..cubicTo(2.114, 12.918, 2.058, 12.961, 2.022, 13)
      ..cubicTo(2.058, 13.039, 2.114, 13.082, 2.188, 13.129)
      ..cubicTo(2.448, 13.293, 2.845, 13.442, 3.379, 13.576)
      ..close();
    canvas.drawPath(p, Paint()..color = color);
  }

  @override
  bool shouldRepaint(_ChargingPadIconPainter old) => old.color != color;
}
```