Icon guidelines

Table of Contents

ORE Studio's icon catalogue lives here as a single visual-language reference. Pick an icon by its semantic category, then match the variant (Regular for default / Filled for active) to the UI state. UI skills drive icon selection from this catalogue; for the broader UI design context see UI design principles. Return to Knowledge.

The asset paths below point into the desktop client's resources/icons/ tree, which went with that client. This page is the record of the intended icon set; it is not a live path list until a UI client carries the assets again.

1. Icon System Overview

ORE Studio uses Microsoft Fluent UI System Icons. All icons follow the naming convention: 

ic_fluent_{concept}_{size}_{variant}.svg

1.1. Variants

  • Regular: Outline style, used for default/passive states and secondary actions.
  • Filled: Solid style, used for active states, emphasis, and primary actions.

1.2. Sizes

  • 16px: Compact UI, inline with text, dense tables.
  • 20px: Standard UI elements, buttons, navigation.
  • 32px: Headers, emphasis areas.
  • 48px: Large feature icons, onboarding, empty states.

1.3. Usage Principles

  1. Consistency: Use the same icon for the same concept throughout the app.
  2. Clarity over decoration: If removing an icon loses no meaning, remove it.
  3. Paired variants: Use regular for default, filled for hover/active/selected.
  4. Adequate spacing: Give icons room to breathe, minimum 4px from text.

2. Icon Inventory

2.1. Actions

Icons representing user-initiated operations.

2.1.1. Add

Create new items, add to lists, insert content.

  • Regular: ic_fluent_add_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: "New" buttons, add to list, create actions.

2.1.2. Copy

Copy an item, creating a duplicate with the same content.

  • Regular: ic_fluent_copy_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: "Copy" toolbar buttons and context menu actions that create a copy of the selected item (e.g. folder, environment, connection). The copy gets the original name suffixed with " (copy)".

2.1.3. Delete

Remove items, clear content, destructive actions.

  • Regular: ic_fluent_delete_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Delete buttons, remove from list. Use filled variant sparingly to indicate destructive nature.

2.1.4. Delete Dismiss

Purge data, clear all, destructive bulk action with finality.

  • Regular: ic_fluent_delete_dismiss_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Purge database actions, clear all data, bulk delete operations. Combines delete (trash can) with dismiss (X) to indicate permanent removal with no undo. Always require confirmation before use.

2.1.5. Edit

Modify existing content, enter edit mode.

  • Regular: ic_fluent_edit_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Edit buttons, modify actions, pencil metaphor.

2.1.6. Save

Persist changes, commit data.

  • Regular: ic_fluent_save_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Save buttons, apply changes.

2.1.7. Checkmark

Confirm action, indicate completion, accept.

  • Regular: ic_fluent_checkmark_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Confirmation buttons, success indicators, selected state in lists.

2.1.8. Dismiss

Close dialogs, cancel operations, clear notifications.

  • Regular: ic_fluent_dismiss_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Close buttons, cancel actions, clear/dismiss.

2.1.9. Star

Favorite, bookmark, rate.

  • Regular: ic_fluent_star_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Regular for "not favorited", filled for "favorited" state.

2.1.10. Terminal

Interactive command shell, console, REPL.

  • Fluent Regular: ic_fluent_window_console_20_regular.svg
  • Fluent Filled: ic_fluent_window_console_20_filled.svg
  • Solar Linear: programming.svg
  • Solar Bold: programming.svg

Usage: Shell widget, console windows, command-line interfaces.

2.1.11. Wand

Generate synthetic data, auto-fill, magic create.

  • Regular: ic_fluent_wand_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Generate buttons, auto-fill actions, create synthetic/test data.

2.1.12. Record

Start recording, capture session.

  • Regular: ic_fluent_record_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Recording controls. Filled indicates actively recording.

2.1.13. Publish

Deploy data to production, upload, send to target system.

  • Regular: ic_fluent_arrow_upload_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Publish buttons, deploy actions, upload data to production tables. Represents sending data "upward" to a target system.

2.1.14. Reload

Refresh data from server, reload content.

  • Regular: None (removed with the Qt client)
  • Filled: None (removed with the Qt client)

Usage: Reload buttons, refresh from server, update data. Use 16px size for toolbar buttons. Distinct from Sync (bidirectional) - Reload implies fetching fresh data from source.

2.1.15. Redo

Redo last undone action, restore previous state.

  • Regular: None (removed with the Qt client)
  • Filled: None (removed with the Qt client)

Usage: Redo buttons in edit contexts. Pairs with Undo (arrow_rotate_counterclockwise). Both Reload and Redo use the same icon; context determines meaning.

2.2. Navigation

Icons for directional movement and navigation controls.

2.2.1. Arrow Left

Navigate back, move left.

  • Regular: ic_fluent_arrow_left_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Back navigation, left scroll controls.

2.2.2. Arrow Right

Navigate forward, move right.

  • Regular: None (removed with the Qt client)
  • Filled: None (removed with the Qt client)

Usage: Forward navigation, right scroll controls, proceed actions.

2.2.3. Arrow Previous

Step to previous item in sequence.

  • Regular: None (removed with the Qt client)
  • Filled: None (removed with the Qt client)

Usage: Pagination, stepper controls, previous item.

2.2.4. Arrow Next

Step to next item in sequence.

  • Regular: None (removed with the Qt client)
  • Filled: None (removed with the Qt client)

Usage: Pagination, stepper controls, next item.

2.2.5. Arrow Download

Download content, export data.

  • Regular: ic_fluent_arrow_download_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Download buttons, export actions.

2.2.6. Arrow Download CSV

Import CSV data.

  • Regular: None (removed with the Qt client)
  • Filled: None (removed with the Qt client)

Usage: Import CSV actions, clearly labeled with text overlay.

2.2.7. Arrow Download FPML

Import FPML data.

  • Regular: None (removed with the Qt client)
  • Filled: None (removed with the Qt client)

Usage: Import FPML actions, clearly labeled with text overlay.

2.2.8. Arrow Download ORE

Import ORE data.

  • Regular: None (removed with the Qt client)
  • Filled: None (removed with the Qt client)

Usage: Import ORE actions, clearly labeled with text overlay.

2.2.9. Arrow Upload CSV

Export CSV data.

  • Regular: None (removed with the Qt client)
  • Filled: None (removed with the Qt client)

Usage: Export CSV actions, clearly labeled with text overlay.

2.2.10. Arrow Upload FPML

Export FPML data.

  • Regular: None (removed with the Qt client)
  • Filled: None (removed with the Qt client)

Usage: Export FPML actions, clearly labeled with text overlay.

2.2.11. Arrow Upload ORE

Export ORE data.

  • Regular: None (removed with the Qt client)
  • Filled: None (removed with the Qt client)

Usage: Export ORE actions, clearly labeled with text overlay.

2.2.12. Arrow Sync

Synchronize data, refresh with server.

  • Regular: ic_fluent_arrow_sync_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Sync buttons, bidirectional refresh.

2.2.13. Arrow Trending

Trades, financial market movement, trending data.

  • Fluent Regular: ic_fluent_arrow_trending_20_regular.svg
  • Fluent Filled: ic_fluent_arrow_trending_20_filled.svg
  • Solar Linear: transfer-horizontal.svg
  • Solar Bold: transfer-horizontal.svg

Usage: Trades management (ActionTrades toolbar/menu). An upward-trending arrow represents financial market activity and transaction flow. Solar fallback: transfer-horizontal.svg.

2.2.14. Arrow Clockwise (16px)

Rotate clockwise, redo action.

  • Regular: None (removed with the Qt client)
  • Filled: None (removed with the Qt client)

Usage: Redo buttons, clockwise rotation controls.

2.2.15. Arrow Rotate Counterclockwise

Undo action, rotate counterclockwise.

  • Regular: ic_fluent_arrow_rotate_counterclockwise_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Undo buttons, counterclockwise rotation, revert changes.

2.3. Status & Feedback

Icons communicating system state and user feedback.

2.3.1. Info

Informational message, help content, details.

  • Regular: ic_fluent_info_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Info tooltips, help buttons, informational banners.

2.3.2. Warning

Caution, potential issue, requires attention.

  • Regular: ic_fluent_warning_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Warning messages, caution indicators. Pair with amber/yellow color.

2.3.3. Error Circle

Error state, failed operation, critical issue.

  • Regular: ic_fluent_error_circle_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Error messages, validation failures, blocked states. Pair with red color.

2.3.4. Question

Help, unknown state, requires clarification.

  • Regular: ic_fluent_question_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Help buttons, FAQ links, contextual help triggers.

2.4. Users & Identity

Icons representing people and account management.

2.4.1. Person

Single user, current user, profile.

  • Regular: ic_fluent_person_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: User profile, account menu, single user reference.

2.4.2. Person Add

Invite user, create account, add team member.

  • Regular: ic_fluent_person_add_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Invite buttons, add user actions, registration.

2.4.3. Person Accounts

Multiple users, team, user management.

  • Regular: ic_fluent_person_accounts_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Team views, user management, multi-user contexts.

2.4.4. Anchor

Fixed reference point a value is measured from.

  • Fluent Regular: ic_fluent_pin_20_regular.svg
  • Fluent Filled: ic_fluent_pin_20_filled.svg
  • Solar Linear: pin.svg
  • Solar Bold: pin.svg

Usage: Tenor Anchor reference data (SPOT, TODAY, TOMORROW, NEAR_LEG, IMM_ROLL) and its window/menu/toolbar icon wherever referenced. Neither Fluent UI nor Solar has a literal nautical-anchor glyph; Pin conveys the same "fixed reference location" concept.

2.5. Security & Access

Icons for authentication and authorization concepts.

2.5.1. Lock Closed

Secured, protected, authentication required.

  • Regular: ic_fluent_lock_closed_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Locked content, secure areas, login required indicators.

2.5.2. Lock Open

Unlocked, accessible, public.

  • Regular: ic_fluent_lock_open_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Unlocked state, public content, access granted.

2.5.3. Password Reset (48px)

Reset credentials, forgot password flow.

  • Regular: ic_fluent_password_reset_48_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Password reset screens, credential recovery flows. Large size for feature prominence.

2.5.4. Key Multiple

Change master password, manage encryption keys.

  • Regular: ic_fluent_key_multiple_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Change master password actions, encryption key management, password vault operations.

2.5.5. Keyboard

Manual data entry, type input, user-typed values.

  • Regular: None (removed with the Qt client)
  • Filled: None (removed with the Qt client)

Usage: Manual entry options in combo boxes or dialogs where the user will type all values themselves (as opposed to selecting from a saved connection or environment). Conveys "I will type this myself".

2.6. Connection Status

Icons indicating connectivity and network state.

2.6.1. Plug Connected

Connected to server, online, link established.

  • Regular: ic_fluent_plug_connected_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Connection status indicators showing active connection.

2.6.2. Plug Disconnected

Disconnected, offline, no connection.

  • Regular: ic_fluent_plug_disconnected_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Disconnected state, offline mode, connection lost.

2.6.3. Plug Connected Checkmark

Connection verified, authenticated connection.

  • Regular: ic_fluent_plug_connected_checkmark_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Verified connection, authenticated session, secure link confirmed.

2.6.4. Server Link

Server connection bookmark, saved connection.

  • Regular: ic_fluent_server_link_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Saved server connections and bookmark management. The Connection Browser window that opened from it was removed with the Qt client.

2.7. Files & Documents

Icons for file system and document operations.

2.7.1. Folder

Directory, container, file group.

  • Regular: ic_fluent_folder_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Folder navigation, directory listings.

2.7.2. Folder Open

Open folder, expanded directory, selected container.

  • Regular: None (removed with the Qt client)
  • Filled: None (removed with the Qt client)

Usage: Expanded folder state in tree views, selected folder.

2.7.3. Document Table

Tabular data, spreadsheet, structured document.

  • Regular: ic_fluent_document_table_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Table views, data documents, spreadsheet-like content.

2.7.4. Document Code (16px)

Source code, script, technical document.

  • Regular: None (removed with the Qt client)
  • Filled: None (removed with the Qt client)

Usage: Code files, scripts, configuration files.

2.7.5. Notepad

Log viewers, text output panes, ORE log content.

  • Fluent Regular: ic_fluent_notepad_20_regular.svg
  • Fluent Filled: ic_fluent_notepad_20_filled.svg
  • Solar Linear: solar_notepad.svg (mapped from document-text.svg)
  • Solar Bold: solar_notepad.svg (mapped from document-text.svg)

Usage: "Logs" toolbar button in the Compute Console Tasks tab and any other action that opens a log or text-output viewer. Distinct from Terminal (interactive shell), DocumentCode (source code), and DocumentTable (tabular data).

2.8. Organisation & Entities

Icons representing organisational structure and business entities.

2.8.1. Organization

Internal parties, legal entities within the firm.

  • Fluent Regular: ic_fluent_organization_20_regular.svg
  • Fluent Filled: ic_fluent_organization_20_filled.svg
  • Solar Linear: buildings-2.svg
  • Solar Bold: buildings-2.svg

Usage: Party management (internal legal entities). Shows an org-chart/hierarchy symbol representing corporate structure.

2.8.2. Handshake

External counterparties, trading relationships.

  • Fluent Regular: ic_fluent_handshake_20_regular.svg
  • Fluent Filled: ic_fluent_handshake_20_filled.svg
  • Solar Linear: hand-shake.svg
  • Solar Bold: hand-shake.svg

Usage: Counterparty management. Represents external business relationships.

2.8.3. People Team

Business units, organisational divisions.

  • Fluent Regular: ic_fluent_people_team_20_regular.svg
  • Fluent Filled: ic_fluent_people_team_20_filled.svg
  • Solar Linear: structure.svg
  • Solar Bold: structure.svg

Usage: Business unit management. Shows a team/group of people, distinct from the building icons used for centres and tenants.

2.8.4. Building Bank

Financial centres, business centres (London, New York, Tokyo).

  • Fluent Regular: ic_fluent_building_bank_20_regular.svg
  • Fluent Filled: ic_fluent_building_bank_20_filled.svg
  • Solar Linear: buildings-3.svg
  • Solar Bold: buildings-3.svg

Usage: Business centre reference data. A bank/institutional building representing financial centres where business operations occur.

2.8.5. Building Skyscraper

Tenants, enterprise organisations.

  • Fluent Regular: ic_fluent_building_skyscraper_20_regular.svg
  • Fluent Filled: ic_fluent_building_skyscraper_20_filled.svg
  • Solar Linear: buildings.svg
  • Solar Bold: buildings.svg

Usage: Tenant management (admin). A tall building/skyscraper representing an enterprise-level organisation.

2.8.6. Building

Generic building, general infrastructure.

  • Fluent Regular: ic_fluent_building_20_regular.svg
  • Fluent Filled: ic_fluent_building_20_filled.svg
  • Solar Linear: buildings.svg
  • Solar Bold: buildings.svg

Usage: Reserved for generic building contexts. Avoid using for specific entity types; prefer the specialised variants above.

2.8.7. Briefcase

Portfolios, investment collections.

  • Fluent Regular: ic_fluent_briefcase_20_regular.svg
  • Fluent Filled: ic_fluent_briefcase_20_filled.svg
  • Solar Linear: case-round.svg
  • Solar Bold: case-round.svg

Usage: Portfolio management. A briefcase representing a collection of investments or financial instruments.

2.8.8. Book Open

Books, trading books, accounting books.

  • Fluent Regular: ic_fluent_book_open_20_regular.svg
  • Fluent Filled: ic_fluent_book_open_20_filled.svg
  • Solar Linear: book-2.svg
  • Solar Bold: book-2.svg

Usage: Book management. An open book representing trading/accounting books. Distinct from the closed Book icon used for methodologies and reference materials.

2.9. Data & Finance

Icons for numerical data and financial concepts.

2.9.1. Chart Multiple

Report definitions, report templates with multiple visualisation types.

  • Fluent Regular: ic_fluent_chart_multiple_20_regular.svg
  • Fluent Filled: ic_fluent_chart_multiple_20_filled.svg
  • Solar Linear: presentation-graph.svg
  • Solar Bold: presentation-graph.svg

Usage: Report Definition management (ActionReportDefinitions). Multiple chart types on one icon conveys "a template that can generate various report formats". Distinct from the histogram icon used for data analytics. Solar fallback: presentation-graph.svg.

2.9.2. Database

Data storage, datasets, data dimensions.

  • Regular: ic_fluent_database_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Dataset views, data dimensions (Origin, Nature, Treatment), data assets.

2.9.3. Code

Coding schemes, classification systems, identifier schemes.

  • Regular: ic_fluent_code_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Coding scheme management (LEI, ISIN, etc.), classification systems.

2.9.4. Book

Methodologies, documentation, reference materials.

  • Regular: ic_fluent_book_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Methodology views, data processing documentation, reference guides.

2.9.5. Clipboard Number 123 (16px)

Numeric data, ID reference, sequence.

  • Regular: None (removed with the Qt client)
  • Filled: None (removed with the Qt client)

Usage: ID fields, numeric references, serial numbers.

2.9.6. Currency Dollar Euro

Financial data, multi-currency, monetary values.

  • Regular: ic_fluent_currency_dollar_euro_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Currency fields, financial data, monetary transactions.

2.10. Compute & Execution

Icons representing compute infrastructure entities and executable work.

2.10.1. Apps

Application modules, compute applications.

  • Fluent Regular: ic_fluent_apps_20_regular.svg
  • Fluent Filled: ic_fluent_apps_20_filled.svg
  • Solar Linear: widget.svg
  • Solar Bold: widget.svg

Usage: Compute application management (ores.compute app entity, e.g. an application such as ores.analytics.quant). A grid of squares representing a set of application modules.

2.10.2. Text Bullet List Square

Batches, collections of work units.

  • Fluent Regular: ic_fluent_text_bullet_list_square_20_regular.svg
  • Fluent Filled: ic_fluent_text_bullet_list_square_20_filled.svg
  • Solar Linear: list-check.svg
  • Solar Bold: list-check.svg

Usage: Compute batch management (ores.compute batch entity). A square with a bulleted text list representing a collection of work units.

2.10.3. Desktop

Host machines, compute hosts.

  • Fluent Regular: ic_fluent_desktop_20_regular.svg
  • Fluent Filled: ic_fluent_desktop_20_filled.svg
  • Solar Linear: monitor.svg
  • Solar Bold: monitor.svg

Usage: Compute host management (ores.compute host entity). A desktop monitor representing a machine that runs work.

2.10.4. Flash Flow

Work units, executable units of work.

  • Fluent Regular: ic_fluent_flash_flow_20_regular.svg
  • Fluent Filled: ic_fluent_flash_flow_20_filled.svg
  • Solar Linear: bolt.svg
  • Solar Bold: bolt.svg

Usage: Compute work unit management (ores.compute workunit entity). A lightning bolt with a flow arrow representing a unit of executable work.

2.11. Time & History

Icons for temporal concepts.

2.11.1. Clock (16px)

Time, schedule, duration.

  • Regular: ic_fluent_clock_16_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Time fields, timestamps, schedule indicators.

2.11.2. History

Activity history, past actions, audit trail.

  • Regular: ic_fluent_history_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: History views, recent items, activity logs.

2.11.3. Calendar Clock

Scheduler, scheduled jobs, cron tasks.

  • Regular: ic_fluent_calendar_clock_20_regular.svg
  • Filled: None (removed with the Qt client)

Usage: Scheduler menu entries, job definition list window title, any UI element representing scheduled/recurring work. Solar fallback: `calendar.svg`.

2.11.4. Calendar Add

Schedule a new job, create a scheduled task.

  • Regular: None (removed with the Qt client)
  • Filled: None (removed with the Qt client)

Usage: "Schedule Job" button in job definition list toolbar. Use instead of generic `Add` when the action specifically creates a scheduled task. Solar fallback: `calendar-add.svg`.

2.11.5. Calendar Cancel

Unschedule a job, deactivate a scheduled task.

  • Regular: None (removed with the Qt client)
  • Filled: None (removed with the Qt client)

Usage: "Unschedule" button in job definition list toolbar and detail dialog. Semantically distinct from `Delete` (which implies permanent removal) — unschedule removes from pg_cron while retaining the definition. Solar fallback: `alarm-remove.svg`.

2.11.6. Tasks App

Job definitions list, task management application.

  • Fluent Regular: ic_fluent_tasks_app_20_regular.svg
  • Fluent Filled: ic_fluent_tasks_app_20_filled.svg
  • Solar Linear: clipboard-list.svg
  • Solar Bold: clipboard-list.svg

Usage: Job Definition management (ActionJobDefinitions toolbar/menu). Represents a task management application — a list of scheduled jobs/tasks to execute. Distinct from CalendarClock (used for scheduler-concept menu entries and window titles) — use TasksApp for the job definitions list window and toolbar button. Solar fallback: clipboard-list.svg.

2.12. Text & Formatting

Icons for text manipulation and formatting.

2.12.1. Text ABC Underline Double (32px)

Text validation, spell check, language processing.

  • Regular: None (removed with the Qt client)
  • Filled: None (removed with the Qt client)

Usage: Spell check, text validation, language tools.

3. Quick Reference Table

Concept Icon Name Regular Filled
Add/Create add_20 Default Active
Copy copy_20 Default Active
Delete/Remove delete_20 Default Danger
Purge/Clear All delete_dismiss_20 Default Danger
Edit/Modify edit_20 Default Active
Save save_20 Default Active
Confirm/Check checkmark_20 Default Done
Cancel/Close dismiss_20 Default Active
Favorite star_20 Off On
Generate wand_20 Default Active
Reload arrow_clockwise_16 Default Active
Redo arrow_clockwise_16 Default Active
Back arrow_left_20 Default Active
Forward arrow_right_20 Default Active
Download arrow_download_20 Default Active
Sync arrow_sync_20 Default Active
Trades arrow_trending_20 Default Active
Undo arrow_rotate_counterclockwise_20 Default Active
Info info_20 Default Active
Warning warning_20 Default Alert
Error error_circle_20 Default Alert
Help question_20 Default Active
User person_20 Default Active
Add User person_add_20 Default Active
Team person_accounts_20 Default Active
Anchor/Reference Pt pin_20 Default Active
Locked lock_closed_20 Default Active
Unlocked lock_open_20 Default Active
Change Password key_multiple_20 Default Active
Manual Entry keyboard_20 Default Active
Connected plug_connected_20 Default Active
Disconnected plug_disconnected_20 Default Alert
Verified Connection plug_connected_checkmark_20 Default Active
Server Link server_link_20 Default Active
Folder folder_20 Closed Active
Folder Open folder_open_20 Open Active
Table Document document_table_20 Default Active
Code Document document_code_16 Default Active
Code/Scheme code_20 Default Active
Database/Dataset database_20 Default Active
Book/Methodology book_20 Default Active
Book Open/Books book_open_20 Default Active
Briefcase/Portfolio briefcase_20 Default Active
Building (generic) building_20 Default Active
Building Bank/Centre building_bank_20 Default Active
Building Skyscraper building_skyscraper_20 Default Active
Organization/Party organization_20 Default Active
Handshake/Cpty handshake_20 Default Active
People Team/BU people_team_20 Default Active
Currency currency_dollar_euro_20 Default Active
Time clock_16 Default Active
History history_20 Default Active
Scheduler/Jobs calendar_clock_20 Default Active
Schedule Job calendar_add_20 Default Active
Unschedule Job calendar_cancel_20 Default Active
Job Definitions List tasks_app_20 Default Active
Report Definitions chart_multiple_20 Default Active
Import CSV arrow_download_csv_20 Default Active
Import FPML arrow_download_fpml_20 Default Active
Import ORE arrow_download_ore_20 Default Active
Export CSV arrow_upload_csv_20 Default Active
Export FPML arrow_upload_fpml_20 Default Active
Export ORE arrow_upload_ore_20 Default Active
Publish arrow_upload_20 Default Active
Terminal window_console_20 Default Active
Notepad (Log Viewer) notepad_20 Default Active
Apps/Application apps_20 Default Active
Batch/Work List text_bullet_list_square_20 Default Active
Host/Desktop desktop_20 Default Active
Work Unit/Flash Flow flash_flow_20 Default Active

4. Adding New Icons

When adding a new icon to ORE Studio, follow these steps:

4.1. Step 1: Locate Icons in Source Repositories

ORE Studio supports two icon sets:

  • Fluent UI System Icons: ~/Development/fluentui-system-icons-main/assets/
  • Solar Icons: ~/Development/solar-icons/packages/core/svgs/

Search for a semantically appropriate icon in both sets. For Fluent UI, look for 20px variants (regular and filled). For Solar, look for Linear and Bold variants.

Example search: 

find ~/Development/fluentui-system-icons-main/assets -name "*upload*20*"
find ~/Development/solar-icons/packages/core/svgs -name "*upload*"

4.2. Step 2: Copy Icons to Project

Copy the icons to the correct locations: 

# Fluent UI icons (regular and filled variants)
cp ".../Arrow Upload/SVG/ic_fluent_arrow_upload_20_regular.svg" \
   projects/ores.web/packages/web/src/assets/icons/regular/

cp ".../Arrow Upload/SVG/ic_fluent_arrow_upload_20_filled.svg" \
   projects/ores.web/packages/web/src/assets/icons/filled/

# Solar icons (Linear and Bold variants)
cp ".../arrows-action/Linear/upload-square.svg" \

cp ".../arrows-action/Bold/upload-square.svg" \

4.3. Step 3: Update Resource File

<!-- Fluent UI icons -->
<file>icons/fluentui/regular/ic_fluent_arrow_upload_20_regular.svg</file>
<file>icons/fluentui/filled/ic_fluent_arrow_upload_20_filled.svg</file>

<!-- Solar icons -->

4.4. Step 4: Add Enum Entry

Add the new icon to the Icon enum in IconUtils.hpp: 

enum class Icon {
    // ... existing entries (alphabetically sorted)
    PlugDisconnected,
    Publish,       // <- New entry
    Question,
    // ...
};

4.5. Step 5: Add Icon Mapping

Add the mapping in IconUtils.cpp in the getIconDef() function: 

case Icon::Publish: return {"ic_fluent_arrow_upload_20", "upload-square.svg"};

The mapping format is:

  • First string: Fluent UI icon base name (without _regular.svg / _filled.svg)
  • Second string: Solar icon filename
  • Optional third parameter: true to force filled/bold variant

4.6. Step 6: Use the Icon

Use the new icon in code: 

action->setIcon(IconUtils::createRecoloredIcon(
    Icon::Publish, IconUtils::DefaultIconColor));

4.7. Step 7: Document the Icon

Update this skill document:

  1. Add the icon to the appropriate category in the Icon Inventory section
  2. Add an entry to the Quick Reference Table

5. See also

  • UI design principles — broader design language.
  • UX Language — the umbrella visual-language reference linking icons, colour semantics and entity window anatomy.

Emacs 29.3 (Org mode 9.6.15)