01 Typography
Display, Fraunces
Find your North Shore.
Section headline in Fraunces
Smaller headline in Fraunces
Label headline in DM Sans
Body, DM Sans
Lead paragraph. Beach days, surf sessions and a place to call home on Oahu’s North Shore.
Body copy is set in DM Sans at a comfortable size with generous line spacing, so long room descriptions stay easy to read. Links are underlined and change color on hover.
Fig. 1 Editorial caption: small, quiet and set apart, like a magazine photo credit.
a note in the margin
02 Color
- Deep Pacific green
#123F3DNavigation, footer, feature panels - Warm paper
#F7F3E9Main page background - Sun-washed sand
#E8D9BBSoft panels and dividers - Coral clay
#D16C45Accents, labels and the Reserve button - Palm-leaf green
#687B59Secondary accents - Dark charcoal
#262B28Body text
Note Buttons use a slightly deeper coral so white text stays easy to read. The brand coral is used for lines, labels and large type.
03 Buttons and links
Reserve Explore accommodations Directions Text link
A round stamp, the kind you would find on a surf shop sticker. Used sparingly on photographs and in the footer.
04 Form fields
Reading text
Pages written in the WordPress editor pick up these styles automatically.
- Bulleted lists get a coral marker.
- Quotes and tables are styled to match.
A pull quote sits in Fraunces italic with a coral rule.