Edit in GitHubLog an issue

sp-icon

Since: UXP 4.1, PS 22.0.0

Display a named icon.

Icons

See:

Example

Copied to your clipboard
<sp-icon name="ui:Magnifier"></sp-icon>

Sizes#

Icons can be rendered in various sizes by specifying a T-Shirt size with a size attribute.

Copied to your clipboard
1<sp-icon size="xxs" name="ui:Magnifier"></sp-icon>
2<sp-icon size="xs" name="ui:Magnifier"></sp-icon>
3<sp-icon size="s" name="ui:Magnifier"></sp-icon>
4<sp-icon size="m" name="ui:Magnifier"></sp-icon>
5<sp-icon size="l" name="ui:Magnifier"></sp-icon>
6<sp-icon size="xl" name="ui:Magnifier"></sp-icon>
7<sp-icon size="xxl" name="ui:Magnifier"></sp-icon>

Built-in Icons#

Spectrum UXP supplies the Spectrum UI icons. They are named as follows:

  • AlertMedium
  • AlertSmall
  • ArrowDownSmall
  • ArrowLeftMedium
  • ArrowUpSmall
  • Asterisk
  • CheckmarkMedium
  • CheckmarkSmall
  • ChevronDownMedium
  • ChevronDownSmall
  • ChevronLeftLarge
  • ChevronLeftMedium
  • ChevronRightLarge
  • ChevronRightMedium
  • ChevronRightSmall
  • ChevronUpSmall
  • CornerTriangle
  • CrossLarge
  • CrossMedium
  • CrossSmall
  • DashSmall
  • DoubleGripper
  • FolderBreadcrumb
  • HelpMedium
  • HelpSmall
  • InfoMedium
  • InfoSmall
  • Magnifier
  • More
  • SkipLeft
  • SkipRight
  • Star
  • StarOutline
  • SuccessMedium
  • SuccessSmall
  • TripleGripper
Copyright © 2021 Adobe. All rights reserved.