#Octicons
Octicons can be used with the Icon component and several other components, including the Badge and Button.
#Samples
#Component
For the Icon component, the icon is specified using the syntax :icon-shortcode:, where shortcode is the name of the icon (found in the table below).
For example, use the code :icon-rocket: for a icon.
When an icon is used in other components, the icon is referred to by only the shortcode.
For example, the following demonstrates using the icon in a Badge and a Button.
| Component | Sample |
|---|---|
| rocket | [!badge icon="rocket" text="rocket"] |
[!button icon="rocket" text="rocket"] |
#Metadata
When an icon is specified within the Page or Project metadata, the icon can be referred to by only its shortcode.
The following sample demonstrates setting a Page icon to a .
--- icon: rocket --- # Sample This is a sample page with a :icon-rocket: icon.
#New icons
There are 1 NEW icons in Retype v3.10.1:
| Icon | Shortcode | Sample |
|---|---|---|
| pause | :icon-pause: |
#All icons
As of v3.10.1, there are 332 Octicons supported and more being added with each new release.
| Icon | Shortcode | Sample |
|---|---|---|
| accessibility | :icon-accessibility: | |
| accessibility-inset | :icon-accessibility-inset: | |
| ai-model | :icon-ai-model: | |
| alert | :icon-alert: | |
| alert-fill | :icon-alert-fill: | |
| apps | :icon-apps: | |
| archive | :icon-archive: | |
| arrow-both | :icon-arrow-both: | |
| arrow-down | :icon-arrow-down: | |
| arrow-down-left | :icon-arrow-down-left: | |
| arrow-down-right | :icon-arrow-down-right: | |
| arrow-left | :icon-arrow-left: | |
| arrow-right | :icon-arrow-right: | |
| arrow-switch | :icon-arrow-switch: | |
| arrow-up | :icon-arrow-up: | |
| arrow-up-left | :icon-arrow-up-left: | |
| arrow-up-right | :icon-arrow-up-right: | |
| beaker | :icon-beaker: | |
| bell | :icon-bell: | |
| bell-fill | :icon-bell-fill: | |
| bell-slash | :icon-bell-slash: | |
| blocked | :icon-blocked: | |
| bold | :icon-bold: | |
| book | :icon-book: | |
| bookmark | :icon-bookmark: | |
| bookmark-fill | :icon-bookmark-fill: | |
| bookmark-filled | :icon-bookmark-filled: | |
| bookmark-slash | :icon-bookmark-slash: | |
| bookmark-slash-fill | :icon-bookmark-slash-fill: | |
| briefcase | :icon-briefcase: | |
| broadcast | :icon-broadcast: | |
| browser | :icon-browser: | |
| bug | :icon-bug: | |
| cache | :icon-cache: | |
| calendar | :icon-calendar: | |
| check | :icon-check: | |
| check-circle | :icon-check-circle: | |
| check-circle-fill | :icon-check-circle-fill: | |
| checkbox | :icon-checkbox: | |
| checklist | :icon-checklist: | |
| chevron-down | :icon-chevron-down: | |
| chevron-left | :icon-chevron-left: | |
| chevron-right | :icon-chevron-right: | |
| chevron-up | :icon-chevron-up: | |
| circle | :icon-circle: | |
| circle-slash | :icon-circle-slash: | |
| clock | :icon-clock: | |
| clock-fill | :icon-clock-fill: | |
| cloud | :icon-cloud: | |
| cloud-offline | :icon-cloud-offline: | |
| code | :icon-code: | |
| code-of-conduct | :icon-code-of-conduct: | |
| code-review | :icon-code-review: | |
| code-square | :icon-code-square: | |
| codescan | :icon-codescan: | |
| codescan-checkmark | :icon-codescan-checkmark: | |
| codespaces | :icon-codespaces: | |
| columns | :icon-columns: | |
| command-palette | :icon-command-palette: | |
| comment | :icon-comment: | |
| comment-discussion | :icon-comment-discussion: | |
| container | :icon-container: | |
| copilot | :icon-copilot: | |
| copilot-error | :icon-copilot-error: | |
| copilot-warning | :icon-copilot-warning: | |
| copy | :icon-copy: | |
| cpu | :icon-cpu: | |
| credit-card | :icon-credit-card: | |
| cross-reference | :icon-cross-reference: | |
| dash | :icon-dash: | |
| database | :icon-database: | |
| dependabot | :icon-dependabot: | |
| desktop-download | :icon-desktop-download: | |
| device-camera | :icon-device-camera: | |
| device-camera-video | :icon-device-camera-video: | |
| device-desktop | :icon-device-desktop: | |
| device-mobile | :icon-device-mobile: | |
| devices | :icon-devices: | |
| diamond | :icon-diamond: | |
| diff | :icon-diff: | |
| diff-added | :icon-diff-added: | |
| diff-ignored | :icon-diff-ignored: | |
| diff-modified | :icon-diff-modified: | |
| diff-removed | :icon-diff-removed: | |
| diff-renamed | :icon-diff-renamed: | |
| discussion-closed | :icon-discussion-closed: | |
| discussion-duplicate | :icon-discussion-duplicate: | |
| discussion-outdated | :icon-discussion-outdated: | |
| dot | :icon-dot: | |
| dot-fill | :icon-dot-fill: | |
| download | :icon-download: | |
| duplicate | :icon-duplicate: | |
| ellipsis | :icon-ellipsis: | |
| eye | :icon-eye: | |
| eye-closed | :icon-eye-closed: | |
| feed-discussion | :icon-feed-discussion: | |
| feed-forked | :icon-feed-forked: | |
| feed-heart | :icon-feed-heart: | |
| feed-issue-closed | :icon-feed-issue-closed: | |
| feed-issue-draft | :icon-feed-issue-draft: | |
| feed-issue-open | :icon-feed-issue-open: | |
| feed-issue-reopen | :icon-feed-issue-reopen: | |
| feed-merged | :icon-feed-merged: | |
| feed-person | :icon-feed-person: | |
| feed-plus | :icon-feed-plus: | |
| feed-public | :icon-feed-public: | |
| feed-pull-request-closed | :icon-feed-pull-request-closed: | |
| feed-pull-request-draft | :icon-feed-pull-request-draft: | |
| feed-pull-request-open | :icon-feed-pull-request-open: | |
| feed-repo | :icon-feed-repo: | |
| feed-rocket | :icon-feed-rocket: | |
| feed-star | :icon-feed-star: | |
| feed-tag | :icon-feed-tag: | |
| feed-trophy | :icon-feed-trophy: | |
| file | :icon-file: | |
| file-added | :icon-file-added: | |
| file-badge | :icon-file-badge: | |
| file-binary | :icon-file-binary: | |
| file-code | :icon-file-code: | |
| file-diff | :icon-file-diff: | |
| file-directory | :icon-file-directory: | |
| file-directory-fill | :icon-file-directory-fill: | |
| file-directory-open-fill | :icon-file-directory-open-fill: | |
| file-directory-symlink | :icon-file-directory-symlink: | |
| file-media | :icon-file-media: | |
| file-moved | :icon-file-moved: | |
| file-removed | :icon-file-removed: | |
| file-submodule | :icon-file-submodule: | |
| file-symlink-file | :icon-file-symlink-file: | |
| file-zip | :icon-file-zip: | |
| filter | :icon-filter: | |
| filter-remove | :icon-filter-remove: | |
| fiscal-host | :icon-fiscal-host: | |
| flame | :icon-flame: | |
| fold | :icon-fold: | |
| fold-down | :icon-fold-down: | |
| fold-up | :icon-fold-up: | |
| gear | :icon-gear: | |
| gift | :icon-gift: | |
| git-branch | :icon-git-branch: | |
| git-commit | :icon-git-commit: | |
| git-compare | :icon-git-compare: | |
| git-merge | :icon-git-merge: | |
| git-merge-queue | :icon-git-merge-queue: | |
| git-pull-request | :icon-git-pull-request: | |
| git-pull-request-closed | :icon-git-pull-request-closed: | |
| git-pull-request-draft | :icon-git-pull-request-draft: | |
| globe | :icon-globe: | |
| goal | :icon-goal: | |
| grabber | :icon-grabber: | |
| graph | :icon-graph: | |
| hash | :icon-hash: | |
| heading | :icon-heading: | |
| heart | :icon-heart: | |
| heart-fill | :icon-heart-fill: | |
| history | :icon-history: | |
| home | :icon-home: | |
| home-fill | :icon-home-fill: | |
| horizontal-rule | :icon-horizontal-rule: | |
| hourglass | :icon-hourglass: | |
| hubot | :icon-hubot: | |
| id-badge | :icon-id-badge: | |
| image | :icon-image: | |
| inbox | :icon-inbox: | |
| infinity | :icon-infinity: | |
| info | :icon-info: | |
| issue-closed | :icon-issue-closed: | |
| issue-draft | :icon-issue-draft: | |
| issue-opened | :icon-issue-opened: | |
| issue-reopened | :icon-issue-reopened: | |
| issue-tracked-by | :icon-issue-tracked-by: | |
| issue-tracks | :icon-issue-tracks: | |
| italic | :icon-italic: | |
| iterations | :icon-iterations: | |
| kebab-horizontal | :icon-kebab-horizontal: | |
| key | :icon-key: | |
| key-asterisk | :icon-key-asterisk: | |
| law | :icon-law: | |
| light-bulb | :icon-light-bulb: | |
| link | :icon-link: | |
| link-external | :icon-link-external: | |
| list-ordered | :icon-list-ordered: | |
| list-unordered | :icon-list-unordered: | |
| location | :icon-location: | |
| lock | :icon-lock: | |
| log | :icon-log: | |
| logo-gist | :icon-logo-gist: | |
| logo-github | :icon-logo-github: | |
:icon-mail: | ||
| mark-github | :icon-mark-github: | |
| markdown | :icon-markdown: | |
| megaphone | :icon-megaphone: | |
| mention | :icon-mention: | |
| meter | :icon-meter: | |
| milestone | :icon-milestone: | |
| mirror | :icon-mirror: | |
| moon | :icon-moon: | |
| mortar-board | :icon-mortar-board: | |
| move-to-bottom | :icon-move-to-bottom: | |
| move-to-end | :icon-move-to-end: | |
| move-to-start | :icon-move-to-start: | |
| move-to-top | :icon-move-to-top: | |
| multi-select | :icon-multi-select: | |
| mute | :icon-mute: | |
| no-entry | :icon-no-entry: | |
| north-star | :icon-north-star: | |
| note | :icon-note: | |
| number | :icon-number: | |
| organization | :icon-organization: | |
| package | :icon-package: | |
| package-dependencies | :icon-package-dependencies: | |
| package-dependents | :icon-package-dependents: | |
| paintbrush | :icon-paintbrush: | |
| paper-airplane | :icon-paper-airplane: | |
| paperclip | :icon-paperclip: | |
| passkey-fill | :icon-passkey-fill: | |
| paste | :icon-paste: | |
| pause | :icon-pause: | |
| pencil | :icon-pencil: | |
| people | :icon-people: | |
| person | :icon-person: | |
| person-add | :icon-person-add: | |
| person-fill | :icon-person-fill: | |
| pin | :icon-pin: | |
| pin-slash | :icon-pin-slash: | |
| pivot-column | :icon-pivot-column: | |
| play | :icon-play: | |
| plug | :icon-plug: | |
| plus | :icon-plus: | |
| plus-circle | :icon-plus-circle: | |
| project | :icon-project: | |
| project-roadmap | :icon-project-roadmap: | |
| project-symlink | :icon-project-symlink: | |
| project-template | :icon-project-template: | |
| pulse | :icon-pulse: | |
| question | :icon-question: | |
| quote | :icon-quote: | |
| read | :icon-read: | |
| redo | :icon-redo: | |
| rel-file-path | :icon-rel-file-path: | |
| reply | :icon-reply: | |
| repo | :icon-repo: | |
| repo-clone | :icon-repo-clone: | |
| repo-delete | :icon-repo-delete: | |
| repo-deleted | :icon-repo-deleted: | |
| repo-forked | :icon-repo-forked: | |
| repo-locked | :icon-repo-locked: | |
| repo-pull | :icon-repo-pull: | |
| repo-push | :icon-repo-push: | |
| repo-template | :icon-repo-template: | |
| report | :icon-report: | |
| rocket | :icon-rocket: | |
| rows | :icon-rows: | |
| rss | :icon-rss: | |
| ruby | :icon-ruby: | |
| screen-full | :icon-screen-full: | |
| screen-normal | :icon-screen-normal: | |
| search | :icon-search: | |
| server | :icon-server: | |
| share | :icon-share: | |
| share-android | :icon-share-android: | |
| shield | :icon-shield: | |
| shield-check | :icon-shield-check: | |
| shield-lock | :icon-shield-lock: | |
| shield-slash | :icon-shield-slash: | |
| shield-x | :icon-shield-x: | |
| sidebar-collapse | :icon-sidebar-collapse: | |
| sidebar-expand | :icon-sidebar-expand: | |
| sign-in | :icon-sign-in: | |
| sign-out | :icon-sign-out: | |
| single-select | :icon-single-select: | |
| skip | :icon-skip: | |
| skip-fill | :icon-skip-fill: | |
| sliders | :icon-sliders: | |
| smiley | :icon-smiley: | |
| sort-asc | :icon-sort-asc: | |
| sort-desc | :icon-sort-desc: | |
| sparkle-fill | :icon-sparkle-fill: | |
| sparkles-fill | :icon-sparkles-fill: | |
| sponsor-tiers | :icon-sponsor-tiers: | |
| square | :icon-square: | |
| square-circle | :icon-square-circle: | |
| square-fill | :icon-square-fill: | |
| squirrel | :icon-squirrel: | |
| stack | :icon-stack: | |
| star | :icon-star: | |
| star-fill | :icon-star-fill: | |
| stop | :icon-stop: | |
| stopwatch | :icon-stopwatch: | |
| strikethrough | :icon-strikethrough: | |
| sun | :icon-sun: | |
| sync | :icon-sync: | |
| tab | :icon-tab: | |
| tab-external | :icon-tab-external: | |
| table | :icon-table: | |
| tag | :icon-tag: | |
| tasklist | :icon-tasklist: | |
| telescope | :icon-telescope: | |
| telescope-fill | :icon-telescope-fill: | |
| terminal | :icon-terminal: | |
| three-bars | :icon-three-bars: | |
| thumbsdown | :icon-thumbsdown: | |
| thumbsup | :icon-thumbsup: | |
| tools | :icon-tools: | |
| tracked-by-closed-completed | :icon-tracked-by-closed-completed: | |
| tracked-by-closed-not-planned | :icon-tracked-by-closed-not-planned: | |
| trash | :icon-trash: | |
| triangle-down | :icon-triangle-down: | |
| triangle-left | :icon-triangle-left: | |
| triangle-right | :icon-triangle-right: | |
| triangle-up | :icon-triangle-up: | |
| trophy | :icon-trophy: | |
| typography | :icon-typography: | |
| undo | :icon-undo: | |
| unfold | :icon-unfold: | |
| unlink | :icon-unlink: | |
| unlock | :icon-unlock: | |
| unmute | :icon-unmute: | |
| unread | :icon-unread: | |
| unverified | :icon-unverified: | |
| upload | :icon-upload: | |
| verified | :icon-verified: | |
| versions | :icon-versions: | |
| video | :icon-video: | |
| webhook | :icon-webhook: | |
| workflow | :icon-workflow: | |
| x | :icon-x: | |
| x-circle | :icon-x-circle: | |
| x-circle-fill | :icon-x-circle-fill: | |
| zap | :icon-zap: | |
| zoom-in | :icon-zoom-in: | |
| zoom-out | :icon-zoom-out: |