Page Comparison

Primary button background and text color primary buttons can be set to use a resorts primary color as background color, and the overlaying text color can be customized to maximize visibility but is recommended to be white or black. The hover background color can also be set.

Link Color

Inventory and pricing scarcity colors

• We continue to offer the ability to customize background color for dates when inventory is scarce. We recommend #F6D241 for ADA compliance and based on A/B test results.

Active state options for attribute selections

Active state attribute values that are selected can be set to use resort’s primary color (or desired color). This active state color will be used for the following control types

• Button chip

• Radio button

• Checkbox

• Datepicker (coming with 1.7)

• Neutral colors - We will use consistent neutral colors that are legible and look great across brands when resort primary or link colors are not used. Examples of this inclued

  • Outline color on controls

  • Black and grey text

  • White backgrounds

  • Grey elevation treatment color

  • The quantity ticker

  • Buttons that aren’t primary buttons and use black (1.4 might be customizable)

  • Grey background on sold out state for calendar

• Warning and success colors - The font and backgroung background colors for these messages is are determined by the design system and is are optimized for the user experience. Examples include:

  • Select Option (Required) Coach message on non defaulted option controls.

• Mobile App bar is transparent when unscrolled and hero is visible, and goes to white with black text when scrolled.