Branding

Customise your VA logos, colours, backgrounds, and styling in Phoenix, Orwell, and Pegasus.

Staff
Last verified: January 30, 2026

Make vAMSYS feel like your own with custom logos, colours, backgrounds, and CSS. These settings apply across Phoenix, Orwell, Pegasus, and emails.

Accessing Design Settings

In Orwell, go to Settings → Design. You need the View Design Settings permission. The Design section contains:

  • Logo Settings - Your logos and login backgrounds

  • Style Settings - Colour overrides and custom CSS

Logos

You need four logo variants to cover all display contexts:

Logo

Where Used

Logo for Bright Backgrounds

Phoenix (light theme)

Logo for Dark Backgrounds

Phoenix (dark theme)

Select Logo for Bright Backgrounds

VA selection page, Pegasus (light theme), emails, Orwell (light theme)

Select Logo for Dark Backgrounds

VA selection page, Pegasus (dark theme), Orwell (dark theme)

Recommended size: 1800 x 400 pixels for all logos.

Why Two Sets of Logos?

Phoenix logos appear in the main navigation and need to work within that context. Select/Orwell/Pegasus logos appear in different layouts (VA selection screens, admin panels, emails) and may need different proportions or styling to look best.

Background Images

Upload background images for your login and registration pages. You can upload multiple images - one is selected at random for each page load.

Recommended size: 1706 x 1600 pixels. Be mindful of file size - avoid large PNGs; use optimised JPEGs instead.

Colour Overrides

Override the default colour scheme with your VA brand colours. Each colour has light and dark theme variants:

Element

Description

Menu Background

Sidebar/navigation menu background

Top Bar Background

Header bar background

Menu Item

Default menu and top bar text colour

Menu Item Active

Currently selected menu item colour

Menu Item Hover

Menu item colour on mouse hover

Body Background

Main content area background

Body Colour

Main text colour

Card Background

Content card/panel backgrounds

Card Title Text

Card header text colour

Table Row Odd/Even

Alternating table row colours

Plane Icon

Aircraft icon colour in UI elements

Leave a colour empty to use the default. Only override what you need.

Custom CSS

For advanced customisation, upload a custom CSS stylesheet. This is loaded after the default styles, allowing you to override any element.

Advanced Feature

Custom CSS is for users who understand CSS, browser developer tools, and can inspect the vAMSYS source styles. No support is provided for CSS customisations. Incorrect CSS can break your VA appearance.

Community CSS Package

If you want comprehensive styling without writing CSS from scratch, the community-maintained vAMSYS v5 Custom CSS package provides an end-to-end solution. Simply edit three colour variables (primary, secondary, dark mode) and upload the stylesheet.

Writing Your Own CSS

To create custom CSS from scratch:

  1. Use browser developer tools to inspect elements you want to change

  2. Write your CSS rules in a .css file

  3. Upload the file to Style Settings

  4. Test in both light and dark themes

Tips

  • Test both themes - Pilots can choose light or dark mode. Ensure your branding works in both.

  • Use transparent backgrounds - Logos with transparent backgrounds adapt better to theme colours.

  • Optimise images - Large images slow page loads. Compress backgrounds before uploading.

  • Check contrast - Ensure text remains readable against your custom colours.

  • Start minimal - Override only what you need. The defaults are designed to work well together.

Was this article helpful?

Back to Documentation