highlight_mouse_cursor icon
The highlight mouse cursor icon from Material Symbols, in UI actions. Preview every style and copy ready-to-use Angular code.
Style
400
Grade
24px
Size
Colour
Template
<mat-icon>highlight_mouse_cursor</mat-icon>Component
import { MatIconModule } from '@angular/material/icon';
@Component({
imports: [MatIconModule],
// …
})highlight_mouse_cursor Variants
Every Material Symbols style, unfilled and filled, at weights 200, 400 and 700. Copy the <mat-icon> for a style, then set fill and weight with font-variation-settings.
Outlined
material-symbols-outlined200
400
700
fill 200
fill 400
fill 700
<mat-icon>highlight_mouse_cursor</mat-icon>Rounded
material-symbols-rounded200
400
700
fill 200
fill 400
fill 700
<mat-icon fontSet="material-symbols-rounded">highlight_mouse_cursor</mat-icon>Sharp
material-symbols-sharp200
400
700
fill 200
fill 400
fill 700
<mat-icon fontSet="material-symbols-sharp">highlight_mouse_cursor</mat-icon>Examples in Angular Material
Common places to use highlight_mouse_cursor, with the template code. Previews are drawn to match Angular Material's Material 3 components.
Icon button
<button mat-icon-button aria-label="Highlight Mouse Cursor">
<mat-icon>highlight_mouse_cursor</mat-icon>
</button>Button with icon
Highlight Mouse Cursor
<button mat-flat-button>
<mat-icon>highlight_mouse_cursor</mat-icon>
Highlight Mouse Cursor
</button>Floating action button
<button mat-fab aria-label="Highlight Mouse Cursor">
<mat-icon>highlight_mouse_cursor</mat-icon>
</button>List item
Highlight Mouse Cursor
<mat-list>
<mat-list-item>
<mat-icon matListItemIcon>highlight_mouse_cursor</mat-icon>
<span matListItemTitle>Highlight Mouse Cursor</span>
</mat-list-item>
</mat-list>Toolbar
My App
<mat-toolbar>
<span>My App</span>
<span class="spacer"></span>
<button mat-icon-button aria-label="Highlight Mouse Cursor">
<mat-icon>highlight_mouse_cursor</mat-icon>
</button>
</mat-toolbar>Form field prefix
Highlight Mouse Cursor
<mat-form-field appearance="outline">
<mat-label>Highlight Mouse Cursor</mat-label>
<mat-icon matPrefix>highlight_mouse_cursor</mat-icon>
<input matInput />
</mat-form-field>About this icon
- Name
- highlight_mouse_cursor
- Icon set
- Material Symbols only (new, not in legacy Material Icons)
- Category
- UI actions
- Also found by
- browser, chromeos, click, clicks, computer, computing, desktop, diagonal, element, focus, geometry, interaction, left, location, move, pointer arrow, pointing, selection, selects, target, tool, traffic
- Symbols codepoint
- U+F511
- Licence
- Apache License 2.0, free for commercial use (Google Fonts)