Pen Prohibited icon
Used to represent a signature, a device drawing input. Use edit in common editing scenarios. The Pen Prohibited icon is part of Microsoft's Fluent UI System Icons, available here in filled and regular (outlined) styles on a 24 px grid. Download it as SVG or PNG, or copy it as code — it's free to use under the MIT License.
Use the Pen Prohibited icon in React
Install Microsoft's @fluentui/react-icons package, then import the component. Icons inherit the current text color, and you can size them with CSS.
npm install @fluentui/react-icons
import { PenProhibited24Regular, PenProhibited24Filled } from "@fluentui/react-icons";
export function Example() {
return <PenProhibited24Regular aria-label="Pen Prohibited" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_pen_prohibited_24_regular.svg" width="24" height="24" alt="Pen Prohibited"> Or paste the SVG markup inline. Setting fill="currentColor" makes the icon follow the text color of its parent:
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15.8911 3.04727C17.2885 1.64967 19.5543 1.6496 20.9519 3.04712C22.3493 4.44453 22.3493 6.71015 20.952 8.10763L17.9075 11.1525C17.4543 11.0524 16.9833 10.9997 16.5 10.9997C16.3021 10.9997 16.1063 11.0085 15.913 11.0258L19.8913 7.04704C20.7029 6.23534 20.7028 4.91942 19.8912 4.10778C19.0795 3.29607 17.7634 3.29611 16.9518 4.10787L5.00175 16.0593C4.79168 16.2694 4.64402 16.5337 4.57521 16.8227L3.76191 20.2385L7.17755 19.4253C7.46668 19.3564 7.73104 19.2087 7.94119 18.9985L10.0261 16.9134C10.0088 17.1065 10 17.3021 10 17.4997C10 17.9832 10.0528 18.4545 10.153 18.9079L9.00191 20.0591C8.59546 20.4656 8.08418 20.7514 7.52498 20.8845L2.92373 21.98C2.67037 22.0404 2.40385 21.9649 2.21968 21.7808C2.03552 21.5966 1.96009 21.3301 2.02041 21.0767L3.116 16.4753C3.2491 15.9162 3.5347 15.4051 3.94103 14.9987L15.8911 3.04727ZM22 17.4997C22 14.4621 19.5376 11.9997 16.5 11.9997C13.4624 11.9997 11 14.4621 11 17.4997C11 20.5372 13.4624 22.9997 16.5 22.9997C19.5376 22.9997 22 20.5372 22 17.4997ZM12.5 17.4997C12.5 15.2905 14.2909 13.4997 16.5 13.4997C17.3335 13.4997 18.1075 13.7546 18.7482 14.1908L13.1911 19.7479C12.755 19.1072 12.5 18.3332 12.5 17.4997ZM16.5 21.4997C15.6665 21.4997 14.8925 21.2447 14.2518 20.8085L19.8089 15.2514C20.245 15.8922 20.5 16.6661 20.5 17.4997C20.5 19.7088 18.7091 21.4997 16.5 21.4997Z" fill="currentColor"/></svg>Use it from the SVG package
Microsoft's @fluentui/svg-icons package contains the raw SVG files, which works well with bundlers that import SVGs:
npm install @fluentui/svg-icons
import icon from "@fluentui/svg-icons/icons/pen_prohibited_24_regular.svg";Details
| Name | Pen Prohibited |
|---|---|
| Styles | Regular (outlined), Filled |
| Size | 24 × 24 px (scalable SVG) |
| Regular (outlined) file | ic_fluent_pen_prohibited_24_regular.svg |
| Filled file | ic_fluent_pen_prohibited_24_filled.svg |
| React components | PenProhibited24Regular, PenProhibited24Filled |
| License | MIT (© Microsoft Corporation) |