Monochrome Icon Library

First demand-driven SVG batch from the Figma Icons page, node 1:89. Icons are raw SVG assets plus CSS mask helpers.

Exported Batch

user-outline user-filled trash-outline trash-filled notification-bell-outline notification-bell-filled themes-dark themes-light

Sizes And Color

The helper uses CSS masks, so icons inherit currentColor from the parent element.

Usage

<span class="sui-icon sui-icon--user-outline" aria-hidden="true"></span>
<button class="sui-btn sui-btn--icon" aria-label="Delete item">
  <span class="sui-icon sui-icon--trash-outline" aria-hidden="true"></span>
</button>

Manifest

Public name	Figma name	Node	Asset path
`user-outline`	User/User Outline	`1:646`	`src/icons/svg/user/user-outline.svg`
`user-filled`	User/User Filled	`1:648`	`src/icons/svg/user/user-filled.svg`
`trash-outline`	Trash/Trash Outline	`1:641`	`src/icons/svg/trash/trash-outline.svg`
`trash-filled`	Trash/Trash Filled	`1:642`	`src/icons/svg/trash/trash-filled.svg`
`notification-bell-outline`	Notification/Bell Outline	`1:548`	`src/icons/svg/notification/notification-bell-outline.svg`
`notification-bell-filled`	Notification/Bell Filled	`1:550`	`src/icons/svg/notification/notification-bell-filled.svg`
`themes-dark`	Themes/Dark	`1:636`	`src/icons/svg/themes/themes-dark.svg`
`themes-light`	Themes/Light	`1:638`	`src/icons/svg/themes/themes-light.svg`

The machine-readable source is src/icons/manifest.json.