Colors
Using the specified colors is essential for maintaining consistency and brand identity across the website. These colors are carefully chosen to align with the brand’s message. Sticking to the approved color palette helps create a cohesive look and feel, making the site easily recognizable and trustworthy. Introducing new or unapproved colors can disrupt this consistency, confuse users, and weaken the overall brand image. Additionally, adding new colors can cause usability issues, such as poor contrast or readability, which may negatively impact the user experience. Therefore, it’s important to strictly adhere to the designated colors to maintain a unified, professional, and user-friendly website.
#019147
#8A6A91
#404040
#FFFFFF
Typography & Hierarchy
Typography plays a critical role in establishing hierarchy on a website, as it helps organize content and guides users through the information seamlessly. By changing things like font size or boldness, you can make certain text, like titles or buttons, stand out so people notice them first. For example, bigger, bold text might show a headline or a “Read More” button, while smaller text can provide extra details. This helps users follow along easily without getting confused. Good use of text styles makes the website not only look better but also feel easier to use, guiding visitors through the most important parts.
Hero Headline - 56px
Do not use Hero Headline in the body content. The type size is used for Hero images and page titles only.
Primary - 40px
Subtitle – 22px
Secondary - 32px
Box Title - 18px
Body Text – 16px
Body Text Italic – 16px
Body Text Bold – 16px
Small Text – 14px
Hierarchy Example:
Primary - Lorem ipsum dolor sit amet, consectetur
Subtitle – Phasellus at sem vitae eros pulvinar dapibus. Suspendisse venenatis augue id purus cursus, nec suscipit nulla feugiat. In vitae lacinia felis, a gravida tortor.
Secondary - Consectetur adipiscing elit
Box Title - Sed fermentum felis
Body Text – Nam aliquet, purus id tempor volutpat, libero lectus iaculis est, ut fringilla leo elit et libero. Phasellus commodo suscipit dui, ac blandit felis dictum eget. Vivamus vehicula nisl nec justo dapibus vehicula.
Turpis turpis urna habitasse venenatis quis habitasse nostra. Leo sodales cursus semper curae at rhoncus aliquet.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras tristique nulla eget libero fermentum, et congue nisi eleifend. Fusce vel nunc sit amet metus vehicula vestibulum id ac urna. Pellentesque a suscipit augue.
Nullam vehicula felis ut sapien fringilla, nec malesuada quam placerat. Proin suscipit erat ut risus aliquet, at interdum magna tempor. Curabitur varius lacus eu ligula blandit, sed porta justo elementum.
Suspendisse eget ex ut magna efficitur mollis nec non felis. Quisque sit amet velit consectetur, malesuada purus vel, lobortis nunc. Nam ac magna at justo efficitur pharetra sed a ligula.
* Small Text – Nam aliquet, purus id tempor volutpat, libero lectus iaculis est, ut fringilla leo elit et libero. Phasellus commodo suscipit dui, ac blandit felis dictum eget. Vivamus vehicula nisl nec justo dapibus vehicula.
Buttons/Hyperlinks
Buttons are critical for usability and user conversion on a website, making it easy for visitors to engage with content or services. A few examples of where to use them include call to actions (CTA), navigation, and submission of forms. Use them sparingly. Below are common buttons used on the website and their interactions. Never change the way they look or interact.
Light Background
Dark Background
Light Background
Dark Background
Section Templates
Section Templates are pre-designed blocks of content, like benefits sections, calls to action, or contact forms, which can be inserted into any page to speed up the design process.
Below are a few examples of section templates.
Add Your Heading Text Here
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Events & Education
Discover upcoming events, register online, enjoy live experiences, connect with community.
Floral Distribution Conference
Join us for the 2025 Floral Distribution Conference, March 2-5, in Miami.
DevX
Join us for DevX 2025 in Cleveland. Immerse yourself in hands-on learning, witness the growing and distribution process, and savor the scenic surroundings.
LearnX
Discover WFFSA’s LearnX, offering members customizable learning experiences. Gain access to our e-Learning program, featuring industry-focused courses for professional development.
Flower Movement
Join the Flower Movement, uniting the floral community. Together, let’s spotlight industry innovators, share stories, and foster unity.
Our Team
A short introduction to your team members and why their background should inspire potential clients’ confidence.
First Last
Company
Board Member
First Last
Company
Board Member
First Last
Company
Board Member
First Last
Company
Board Member