Gentleface › Actions › zoom-in
zoom-in icon
zoom-inZoom in: zoom in, magnify, enlarge view. Drawn on the 16 px grid. Free SVG, PNG and code, MIT licensed.
Code line-round
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M15.003 14.5C15.003 14.636 14.953 14.754 14.854 14.854C14.754 14.953 14.636 15.003 14.5 15.003C14.364 15.003 14.246 14.953 14.146 14.854L10.02 10.727C9.573 11.101 9.074 11.396 8.525 11.614C7.874 11.871 7.199 12 6.5 12C5.801 12 5.126 11.871 4.475 11.614C3.769 11.334 3.148 10.926 2.611 10.389C2.074 9.852 1.666 9.231 1.386 8.525C1.129 7.874 1 7.199 1 6.5C1 5.801 1.129 5.126 1.386 4.475C1.666 3.769 2.074 3.148 2.611 2.611C3.148 2.074 3.769 1.666 4.475 1.386C5.126 1.129 5.801 1 6.5 1C7.199 1 7.874 1.129 8.525 1.386C9.231 1.666 9.852 2.074 10.389 2.611C10.926 3.148 11.334 3.769 11.614 4.475C11.871 5.126 12 5.801 12 6.5C12 7.199 11.871 7.874 11.614 8.525C11.396 9.074 11.101 9.573 10.727 10.02L14.854 14.146C14.953 14.246 15.003 14.364 15.003 14.5ZM9.98 9.273L10.016 9.309C10.295 8.962 10.517 8.577 10.684 8.156C10.895 7.624 11 7.072 11 6.5C11 5.928 10.895 5.376 10.684 4.844C10.455 4.266 10.121 3.757 9.682 3.318C9.243 2.879 8.734 2.545 8.156 2.316C7.624 2.105 7.072 2 6.5 2C5.928 2 5.376 2.105 4.844 2.316C4.266 2.545 3.757 2.879 3.318 3.318C2.879 3.757 2.545 4.266 2.316 4.844C2.105 5.376 2 5.928 2 6.5C2 7.072 2.105 7.624 2.316 8.156C2.545 8.734 2.879 9.243 3.318 9.682C3.757 10.121 4.266 10.455 4.844 10.684C5.376 10.895 5.928 11 6.5 11C7.072 11 7.624 10.895 8.156 10.684C8.577 10.517 8.962 10.295 9.309 10.016L9.273 9.98C9.535 9.772 9.772 9.535 9.98 9.273ZM8.5 6C8.641 6 8.759 6.048 8.856 6.144C8.952 6.241 9 6.359 9 6.5C9 6.641 8.952 6.759 8.856 6.856C8.759 6.952 8.641 7 8.5 7L7 7L7 8.5C7 8.641 6.952 8.759 6.856 8.856C6.759 8.952 6.641 9 6.5 9C6.359 9 6.241 8.952 6.144 8.856C6.048 8.759 6 8.641 6 8.5L6 7L4.5 7C4.359 7 4.241 6.952 4.144 6.856C4.048 6.759 4 6.641 4 6.5C4 6.359 4.048 6.241 4.144 6.144C4.241 6.048 4.359 6 4.5 6L6 6L6 4.5C6 4.359 6.048 4.241 6.144 4.144C6.241 4.048 6.359 4 6.5 4C6.641 4 6.759 4.048 6.856 4.144C6.952 4.241 7 4.359 7 4.5L7 6L8.5 6Z"/></svg>
// Gentleface "zoom-in" (line-round), MIT. https://gentleface.com/icons/zoom-in
import type { SVGProps } from 'react';
export function ZoomInIcon(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="M15.003 14.5C15.003 14.636 14.953 14.754 14.854 14.854C14.754 14.953 14.636 15.003 14.5 15.003C14.364 15.003 14.246 14.953 14.146 14.854L10.02 10.727C9.573 11.101 9.074 11.396 8.525 11.614C7.874 11.871 7.199 12 6.5 12C5.801 12 5.126 11.871 4.475 11.614C3.769 11.334 3.148 10.926 2.611 10.389C2.074 9.852 1.666 9.231 1.386 8.525C1.129 7.874 1 7.199 1 6.5C1 5.801 1.129 5.126 1.386 4.475C1.666 3.769 2.074 3.148 2.611 2.611C3.148 2.074 3.769 1.666 4.475 1.386C5.126 1.129 5.801 1 6.5 1C7.199 1 7.874 1.129 8.525 1.386C9.231 1.666 9.852 2.074 10.389 2.611C10.926 3.148 11.334 3.769 11.614 4.475C11.871 5.126 12 5.801 12 6.5C12 7.199 11.871 7.874 11.614 8.525C11.396 9.074 11.101 9.573 10.727 10.02L14.854 14.146C14.953 14.246 15.003 14.364 15.003 14.5ZM9.98 9.273L10.016 9.309C10.295 8.962 10.517 8.577 10.684 8.156C10.895 7.624 11 7.072 11 6.5C11 5.928 10.895 5.376 10.684 4.844C10.455 4.266 10.121 3.757 9.682 3.318C9.243 2.879 8.734 2.545 8.156 2.316C7.624 2.105 7.072 2 6.5 2C5.928 2 5.376 2.105 4.844 2.316C4.266 2.545 3.757 2.879 3.318 3.318C2.879 3.757 2.545 4.266 2.316 4.844C2.105 5.376 2 5.928 2 6.5C2 7.072 2.105 7.624 2.316 8.156C2.545 8.734 2.879 9.243 3.318 9.682C3.757 10.121 4.266 10.455 4.844 10.684C5.376 10.895 5.928 11 6.5 11C7.072 11 7.624 10.895 8.156 10.684C8.577 10.517 8.962 10.295 9.309 10.016L9.273 9.98C9.535 9.772 9.772 9.535 9.98 9.273ZM8.5 6C8.641 6 8.759 6.048 8.856 6.144C8.952 6.241 9 6.359 9 6.5C9 6.641 8.952 6.759 8.856 6.856C8.759 6.952 8.641 7 8.5 7L7 7L7 8.5C7 8.641 6.952 8.759 6.856 8.856C6.759 8.952 6.641 9 6.5 9C6.359 9 6.241 8.952 6.144 8.856C6.048 8.759 6 8.641 6 8.5L6 7L4.5 7C4.359 7 4.241 6.952 4.144 6.856C4.048 6.759 4 6.641 4 6.5C4 6.359 4.048 6.241 4.144 6.144C4.241 6.048 4.359 6 4.5 6L6 6L6 4.5C6 4.359 6.048 4.241 6.144 4.144C6.241 4.048 6.359 4 6.5 4C6.641 4 6.759 4.048 6.856 4.144C6.952 4.241 7 4.359 7 4.5L7 6L8.5 6Z" />
</svg>
);
}Vue: see /icons/zoom-in.md
Svelte: see /icons/zoom-in.md
HTML img: see /icons/zoom-in.md
CSS: see /icons/zoom-in.md
Data URL: see /icons/zoom-in.md
Sprite: see /icons/zoom-in.md
SwiftUI: see /icons/zoom-in.md
Compose: see /icons/zoom-in.md
Android XML: see /icons/zoom-in.md
Flutter: see /icons/zoom-in.md
Each SVG is 16 × 16 with fill="currentColor". Keep it at 16 px or an exact multiple (32, 48) on whole pixels: a fractional size or position blurs it. 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. More in how to use.
Meaning
- Use it for
- zoom in, magnify, enlarge view
- Alternatives
maximize: enlarge a window or go full screen
- Don’t confuse with
search: the plain lens means search; zoom has + inside
- Also fits
- enlarge: zoom into a view without changing the object's size (zoom-in)
- Not for
- search (use
search): + inside the lens means zoom
- search (use
- Tags
- zoom, magnifier, lens, plus, enlarge, bigger, scale
- Category
- Actions
- Component name
ZoomInIcon- History
- added
Family 8
More actions icons
arrow-down-a-z ban bolt bolt-off check check-double clipboard clipboard-alert clipboard-check clipboard-clock clipboard-list clipboard-off clipboard-pencil clipboard-plus clipboard-search clipboard-user · all actions icons
For agents
Metadata: /icons/zoom-in.json · Markdown: /icons/zoom-in.md · SVG: https://gentleface.com/svg/{style}/16/zoom-in.svg · PNG: https://gentleface.com/png/{style}/{16|32|48}/zoom-in.png