Claude-skill-registry icon-replacement

Find replacement icons for migration. Use when migrating old code that uses icons not available in the new system, or when you need to find a suitable icon from the available icon set.

install
source · Clone the upstream repo
git clone https://github.com/majiayu000/claude-skill-registry
Claude Code · Install into ~/.claude/skills/
T=$(mktemp -d) && git clone --depth=1 https://github.com/majiayu000/claude-skill-registry "$T" && mkdir -p ~/.claude/skills && cp -r "$T/skills/data/icon-replacement" ~/.claude/skills/majiayu000-claude-skill-registry-icon-replacement && rm -rf "$T"
manifest: skills/data/icon-replacement/SKILL.md
source content

Find and suggest replacement icons during migration. This skill provides the complete list of available icons in the One-UI system.

Arguments

  • $ARGUMENTS
    - Query or command:
    • <old-icon-name>
      - Find a replacement for a specific icon
    • list
      - Show all available icons
    • search <keyword>
      - Search icons by keyword
    • category <name>
      - Show icons by category (navigation, action, status, network, file, etc.)

Available Icons

Navigation & Menu

  • icon:arrow_back
  • icon:arrow_forward
  • icon:arrow_left
  • icon:arrow_right
  • icon:arrow_upward
  • icon:arrow_downward
  • icon:arrow_drop_down
  • icon:arrow_drop_up
  • icon:arrow_circle_down
  • icon:arrow_circle_up
  • icon:navigate_before
  • icon:navigate_next
  • icon:first_page
  • icon:last_page
  • icon:keyboard_arrow_down
  • icon:keyboard_arrow_up
  • icon:menu
  • icon:apps
  • icon:home
  • icon:dashboard

Actions

  • icon:add
  • icon:add_box
  • icon:add_circle
  • icon:add_link
  • icon:remove
  • icon:remove_circle
  • icon:edit
  • icon:edit_attributes
  • icon:edit_notifications
  • icon:edit_off
  • icon:delete_forever
  • icon:save
  • icon:cancel
  • icon:clear
  • icon:done
  • icon:check_circle
  • icon:refresh
  • icon:sync_alt
  • icon:loop
  • icon:undo
  • icon:redo
  • icon:download
  • icon:upload
  • icon:send
  • icon:forward
  • icon:launch
  • icon:search
  • icon:filter_alt
  • icon:tune
  • icon:settings
  • icon:settings_applications
  • icon:settings_ethernet
  • icon:settings_input_component
  • icon:settings_power
  • icon:settings_remote
  • icon:settings_suggest
  • icon:build
  • icon:create_new_folder
  • icon:attach_file
  • icon:file_copy
  • icon:link
  • icon:link_off
  • icon:login
  • icon:lock
  • icon:lock_open
  • icon:vpn_key
  • icon:fullscreen
  • icon:fullscreen_exit
  • icon:drag_indicator
  • icon:place_item

Status & Indicators

  • icon:info
  • icon:info_outline
  • icon:help
  • icon:help_outline
  • icon:warning
  • icon:error
  • icon:priority_high
  • icon:notifications
  • icon:notifications_active
  • icon:notifications_none
  • icon:notifications_off
  • icon:circle
  • icon:panorama_fish_eye
  • icon:highlight_off
  • icon:hide_source
  • icon:visibility
  • icon:visibility_off
  • icon:task_alt
  • icon:pending_actions
  • icon:running_with_errors
  • icon:sync_disabled
  • icon:sync_problem
  • icon:troubleshoot
  • icon:verified_user
  • icon:policy
  • icon:security

Network & Connectivity

  • icon:wifi
  • icon:wifi_off
  • icon:wifi_1_bar
  • icon:wifi_2_bar
  • icon:wifi_medium_darkTheme
  • icon:wifi_medium_lightTheme
  • icon:wifi_strength_darkTheme
  • icon:wifi_strength_lightTheme
  • icon:wifi_weak_darkTheme
  • icon:wifi_weak_lightTheme
  • icon:signal_cellular_alt
  • icon:signal_cellular_alt_1_bar
  • icon:signal_cellular_alt_2_bar
  • icon:lan
  • icon:device_hub
  • icon:router
  • icon:cable
  • icon:cloud_off
  • icon:cloud_queue
  • icon:cloud-upload-outline
  • icon:api
  • icon:storage
  • icon:network_manage

Files & Documents

  • icon:folder
  • icon:folder_off
  • icon:folder_open
  • icon:article
  • icon:description
  • icon:assignment
  • icon:inventory
  • icon:archive
  • icon:unarchive

People & Accounts

  • icon:person
  • icon:account_box
  • icon:account_tree
  • icon:group_work
  • icon:engineering-maintenance

Time & Schedule

  • icon:schedule
  • icon:schedule_send
  • icon:today
  • icon:event_busy
  • icon:event_note
  • icon:history
  • icon:update
  • icon:upgrade

UI Elements

  • icon:star
  • icon:star_border
  • icon:favorite
  • icon:favorite_border
  • icon:bookmark_star
  • icon:push_pin
  • icon:outlined-push_pin
  • icon:label
  • icon:local_offer
  • icon:category
  • icon:style
  • icon:widgets
  • icon:extension
  • icon:more_vert
  • icon:unfold_less
  • icon:unfold_more
  • icon:density_large
  • icon:density_medium
  • icon:density_small
  • icon:view_headline
  • icon:grid
  • icon:format_list_numbered_rtl

Trends & Analytics

  • icon:trending_up
  • icon:trending_down
  • icon:trending_flat
  • icon:calculate
  • icon:functions

Location & GPS

  • icon:location
  • icon:my_location
  • icon:gps_fixed
  • icon:near_me
  • icon:outlined-near_me
  • icon:apartment
  • icon:room_preferences

Media & Image

  • icon:camera
  • icon:image-outline
  • icon:wallpaper
  • icon:center_focus_weak

Communication

  • icon:email
  • icon:mark_email_unread
  • icon:sms
  • icon:phone
  • icon:outlined-feedback

Play Controls

  • icon:play_circle
  • icon:pause_circle
  • icon:restart_alt
  • icon:power_settings_new
  • icon:left_circle

MX Custom Icons (Moxa-specific)

  • icon:mx-509_certificate
  • icon:mx-application_cog_outline
  • icon:mx-application_empty
  • icon:mx-calendar_clock
  • icon:mx-circle_dash
  • icon:mx-cog-off
  • icon:mx-cursor-add-outline
  • icon:mx-cursor-add
  • icon:mx-cursor-outline
  • icon:mx-cursor
  • icon:mx-default_route
  • icon:mx-empty_state_404
  • icon:mx-empty_state_500
  • icon:mx-empty_state_box
  • icon:mx-empty_state_module_not_found
  • icon:mx-ethernet_port
  • icon:mx-export
  • icon:mx-file-eye-outline
  • icon:mx-file_cog_outline
  • icon:mx-folder-cog
  • icon:mx-form-textbox
  • icon:mx-forward
  • icon:mx-grid
  • icon:mx-horizontal-line
  • icon:mx-horizontal_align_center
  • icon:mx-https
  • icon:mx-ip_network_outline
  • icon:mx-lan
  • icon:mx-moxa_device_extension
  • icon:mx-moxa_m
  • icon:mx-network_service
  • icon:mx-package_update
  • icon:mx-redundancy
  • icon:mx-remote_vpn
  • icon:mx-restart
  • icon:mx-ring
  • icon:mx-router_empty
  • icon:mx-safety_check
  • icon:mx-scan_device
  • icon:mx-switching
  • icon:mx-system-dashboard
  • icon:mx-tag-search
  • icon:mx-ungroup
  • icon:mx-verified_error
  • icon:mx-verified_unknow
  • icon:mx-vertical-line
  • icon:mx-wan

Project Types

  • icon:project_type_agt
  • icon:project_type_tpe
  • icon:apollo_project
  • icon:tenancy

Misc

  • icon:local_activity
  • icon:card_membership
  • icon:medical_information
  • icon:dynamic_form
  • icon:shape_line_outline
  • icon:cleaning_services
  • icon:low_priority
  • icon:multiple_stop
  • icon:terminal
  • icon:vertical_align_center
  • icon:pan_tool
  • icon:pan_tool-outline
  • icon:outlined-gpp_bad
  • icon:outlined-stop_circle
  • icon:outlined-verified_user
  • icon:outlined-view_week

Common Icon Replacements

When migrating from legacy icons, use these suggested replacements:

Legacy IconReplacementReason
close
icon:clear
or
icon:cancel
Clear for dismiss, cancel for cancel action
check
icon:done
or
icon:check_circle
Done for simple check, check_circle for emphasis
add_circle_outline
icon:add_circle
Unified style
remove_circle_outline
icon:remove_circle
Unified style
settings_outline
icon:settings
Unified style
cloud_upload
icon:cloud-upload-outline
Use outline variant
cloud_download
icon:download
Use generic download
file_download
icon:download
Use generic download
file_upload
icon:upload
Use generic upload
exit_to_app
icon:login
or
icon:launch
Login for auth, launch for external
open_in_new
icon:launch
Use launch for external links
content_copy
icon:file_copy
Use file_copy
feedback
icon:outlined-feedback
Use outlined variant
pin
icon:push_pin
Use push_pin
ethernet
icon:settings_ethernet
or
icon:mx-ethernet_port
Use MX variant for ports
network_check
icon:network_manage
Use network_manage
vpn_lock
icon:mx-remote_vpn
Use MX VPN icon
restart
icon:restart_alt
or
icon:mx-restart
Use MX variant if available
sync
icon:sync_alt
or
icon:loop
sync_alt for bidirectional, loop for repeat
bolt
icon:power_settings_new
Use power icon
certificate
icon:mx-509_certificate
Use MX certificate icon

Workflow

For
<old-icon-name>
query:

  1. Search for exact match in available icons
  2. If not found, suggest closest alternatives based on:
    • Semantic meaning
    • Visual similarity
    • Common use cases
  3. Provide 2-3 options with explanations

For
search <keyword>
:

  1. Search icon names containing the keyword
  2. Return all matches grouped by category

For
category <name>
:

  1. Return all icons in that category
  2. Categories: navigation, action, status, network, file, people, time, ui, trend, location, media, communication, play, mx, project, misc

Output Format

For replacement queries:

## Icon Replacement for `{old-icon}`

**Recommended:** `icon:{recommended}` - {reason}

**Alternatives:**
- `icon:{alt1}` - {reason1}
- `icon:{alt2}` - {reason2}

**Usage:**
```html
<mat-icon svgIcon="{recommended}"></mat-icon>

### For search/list:

Icons matching "{keyword}"

{Category 1}

  • icon:name1
  • icon:name2

{Category 2}

  • icon:name3