This announcement bar can be used to inform users of your
Find a Property
Modular & Reusable
Primaries and grays
HH Slate Grey
HH Light Steel
Headings, body and other common text elements.
You can make any text element display as a 'Display 1' or 'Display 2' size by adding the class 'Display 1' or 'Display 2' to it.
Small Text Muted
Common interface and social network iconography
Component, text style and size variations
Use the class "Button" on an element to format as a button. To format as a large or small button, add the class "Button Large" or "Button Small"
Add the class "Button Outline" a "Button" element to format as an outlined button.
Structural component for displaying boxed content
Text in the card body. A flexible aesthetic makes Foray the perfect starting point for all websites, from portfolio to product brochure.
A flexible aesthetic makes Foray the perfect starting point for all websites, from portfolio to product brochure.
Size and state variations for text inputs and selectables.
Add the class "Form Input" a form input element to format as above. Add the classes "Form Input Small" or "Form Input Large" to control the size.
Checkboxes + Radios
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Combine with other components to display metadata
Use the class "Badge" to format an element as a badge. Use the
background color classes
. Example add the class "BG Primary 1" to a "Badge" element to control its background color.