Select Object icon
Used in canvas selection states. The Select Object 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 Select Object 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 { SelectObject24Regular, SelectObject24Filled } from "@fluentui/react-icons";
export function Example() {
return <SelectObject24Regular aria-label="Select Object" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_select_object_24_regular.svg" width="24" height="24" alt="Select Object"> 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="M7 5C7 6.10457 6.10457 7 5 7C3.89543 7 3 6.10457 3 5C3 3.89543 3.89543 3 5 3C6.10457 3 7 3.89543 7 5ZM8 4.75C8 5.16421 8.33579 5.5 8.75 5.5L15.25 5.5C15.6642 5.5 16 5.16421 16 4.75C16 4.33579 15.6642 4 15.25 4L8.75 4C8.33579 4 8 4.33579 8 4.75ZM4.75 8C4.33579 8 4 8.33579 4 8.75V15.25C4 15.6642 4.33579 16 4.75 16C5.16421 16 5.5 15.6642 5.5 15.25V8.75C5.5 8.33579 5.16421 8 4.75 8ZM19.25 8C18.8358 8 18.5 8.33579 18.5 8.75V15.25C18.5 15.6642 18.8358 16 19.25 16C19.6642 16 20 15.6642 20 15.25V8.75C20 8.33579 19.6642 8 19.25 8ZM8.75 20C8.33579 20 8 19.6642 8 19.25C8 18.8358 8.33579 18.5 8.75 18.5H15.25C15.6642 18.5 16 18.8358 16 19.25C16 19.6642 15.6642 20 15.25 20H8.75ZM5 21C6.10457 21 7 20.1046 7 19C7 17.8954 6.10457 17 5 17C3.89543 17 3 17.8954 3 19C3 20.1046 3.89543 21 5 21ZM21 5C21 6.10457 20.1046 7 19 7C17.8954 7 17 6.10457 17 5C17 3.89543 17.8954 3 19 3C20.1046 3 21 3.89543 21 5ZM19 21C20.1046 21 21 20.1046 21 19C21 17.8954 20.1046 17 19 17C17.8954 17 17 17.8954 17 19C17 20.1046 17.8954 21 19 21Z" 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/select_object_24_regular.svg";Details
| Name | Select Object |
|---|---|
| Styles | Regular (outlined), Filled |
| Size | 24 × 24 px (scalable SVG) |
| Regular (outlined) file | ic_fluent_select_object_24_regular.svg |
| Filled file | ic_fluent_select_object_24_filled.svg |
| React components | SelectObject24Regular, SelectObject24Filled |
| License | MIT (© Microsoft Corporation) |