Edit Prohibited icon
Used in editing/update or drawing scenarios. The Edit 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 Edit 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 { EditProhibited24Regular, EditProhibited24Filled } from "@fluentui/react-icons";
export function Example() {
return <EditProhibited24Regular aria-label="Edit Prohibited" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_edit_prohibited_24_regular.svg" width="24" height="24" alt="Edit 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="M20.9519 3.0481C19.5543 1.65058 17.2885 1.65064 15.8911 3.04825L3.94103 14.9997C3.5347 15.4061 3.2491 15.9172 3.116 16.4762L2.02041 21.0777C1.96009 21.3311 2.03552 21.5976 2.21968 21.7817C2.40385 21.9659 2.67037 22.0413 2.92373 21.981L7.52498 20.8855C8.08418 20.7523 8.59546 20.4666 9.00191 20.0601L10.1531 18.9088C10.0528 18.4552 10 17.9838 10 17.5C10 17.3026 10.0088 17.1073 10.026 16.9144L7.94119 18.9995C7.73104 19.2097 7.46668 19.3574 7.17755 19.4263L3.76191 20.2395L4.57521 16.8237C4.64402 16.5346 4.79168 16.2704 5.00175 16.0603L15 6.06084L17.9394 9.00018L15.9137 11.0261C16.1068 11.0088 16.3024 11 16.5 11C16.9835 11 17.4547 11.0528 17.9081 11.1529L20.952 8.10861C22.3493 6.71112 22.3493 4.4455 20.9519 3.0481ZM16.9518 4.10884C17.7634 3.29709 19.0795 3.29705 19.8912 4.10876C20.7028 4.9204 20.7029 6.23632 19.8913 7.04801L19 7.93946L16.0606 5.00012L16.9518 4.10884ZM22 17.5C22 20.5376 19.5376 23 16.5 23C13.4624 23 11 20.5376 11 17.5C11 14.4624 13.4624 12 16.5 12C19.5376 12 22 14.4624 22 17.5ZM12.5 17.5C12.5 18.3335 12.755 19.1075 13.1911 19.7482L18.7482 14.1911C18.1075 13.755 17.3335 13.5 16.5 13.5C14.2909 13.5 12.5 15.2909 12.5 17.5ZM16.5 21.5C18.7091 21.5 20.5 19.7091 20.5 17.5C20.5 16.6665 20.245 15.8925 19.8089 15.2518L14.2518 20.8089C14.8925 21.245 15.6665 21.5 16.5 21.5Z" 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/edit_prohibited_24_regular.svg";Details
| Name | Edit Prohibited |
|---|---|
| Styles | Regular (outlined), Filled |
| Size | 24 × 24 px (scalable SVG) |
| Regular (outlined) file | ic_fluent_edit_prohibited_24_regular.svg |
| Filled file | ic_fluent_edit_prohibited_24_filled.svg |
| React components | EditProhibited24Regular, EditProhibited24Filled |
| License | MIT (© Microsoft Corporation) |