Components

Client-First is a set of guidelines and strategies created by Finsweet to help you build Webflow websites.

Buttons

Button text
Button Primary Solid Small
Button text
Button Primary Solid Medium
Button text
Button Primary Solid Large
Button text
Button Primary Solid XLarge
Button text
Button Primary Outline Small
Button text
Button Primary Outline Medium
Button text
Button Primary Outline Large
Button text
Button Primary Outline XLarge
Button text
Button Primary Ghost Small
Button text
Button Primary Ghost Medium
Button text
Button Primary Ghost Large
Button text
Button Primary Ghost XLarge
Button text
Button Neutral Solid Small
Button text
Button Neutral Solid Medium
Button text
Button Neutral Solid Large
Button text
Button Neutral Solid XLarge
Button text
Button Neutral Outline Small
Button text
Button Neutral Outline Medium
Button text
Button Neutral Outline Large
Button text
Button Neutral Outline XLarge
Button text
Button Neutral Ghost Small
Button text
Button Neutral Ghost Medium
Button text
Button Neutral Ghost Large
Button text
Button Neutral Ghost XLarge
Button text
Button White Solid Small
Button text
Button White Solid Medium
Button text
Button White Solid Large
Button text
Button White Solid XLarge
Button text
Button White Outline Small
Button text
Button White Outline Medium
Button text
Button White Outline Large
Button text
Button White Outline XLarge
Button text
Button White Ghost Small
Button text
Button White Ghost Medium
Button text
Button White Ghost Large
Button text
Button White Ghost XLarge

Badges

Label
Badge Primary Faded
XSmall
Label
Badge Primary Faded
Small
Label
Badge Primary Faded
Medium
Label
Badge Primary Outline
XSmall
Label
Badge Primary Outline
Small
Label
Badge Primary Outline
Medium
Label
Badge Neutral Faded
XSmall
Label
Badge Neutral Faded
Small
Label
Badge Neutral Faded
Medium
Label
Badge Neutral Outline
XSmall
Label
Badge Neutral Outline
Small
Label
Badge Neutral Outline
Medium
Label
Badge White Faded
XSmall
Label
Badge White Faded
Small
Label
Badge White Faded
Medium
Label
Badge White Outline
XSmall
Label
Badge White Outline
Small
Label
Badge White Outline
Medium

Badge groups

Update
Explore our latest release
Badge Group Primary Faded Small
Update
Explore our latest release
Badge Group Primary Faded Medium
Update
Explore our latest release
Badge Group Primary Outline Small
Update
Explore our latest release
Badge Group Primary Outline Medium
Update
Explore our latest release
Badge Group Neutral Faded Small
Update
Explore our latest release
Badge Group Neutral Faded Medium
Update
Explore our latest release
Badge Group Neutral Outline Small
Update
Explore our latest release
Badge Group Neutral Outline Medium
Update
Explore our latest release
Badge Group White Faded Small
Update
Explore our latest release
Badge Group White Faded Medium
Update
Explore our latest release
Badge Group White Outline Small
Update
Explore our latest release
Badge Group White Outline Medium

Form elements

Input caption goes here
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Input Small
Input caption goes here
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Input Medium
Input caption goes here
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Input Icon Small
Input caption goes here
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Input Icon Medium
Field caption goes here
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Select Small
Field caption goes here
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Select Medium
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Checkbox Small
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Checkbox Medium
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Radio Small
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Radio Medium
Input caption goes here
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Input Small
Input caption goes here
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Input Medium

Tabs horizontal

Tabs Horizontal Neutral
Tabs Horizontal Neutral Ghost
Tabs Horizontal Bordered
Tabs Horizontal White

Tabs vertical

Tabs Vertical Neutral
Tabs Vertical Neutral Ghost
Tabs Vertical Neutral Ghost
Tabs Vertical Neutral Ghost

Dropdowns

Avatars

Avatar

Avatar XSmall
Avatar Small
Avatar Medium
Avatar Large
Avatar XLarge
Avatar Icon XSmall
Avatar Icon Small
Avatar Icon Medium
Avatar Icon Large
Avatar Icon XLarge
MU
Avatar Text XSmall
MU
Avatar Text Small
MU
Avatar Text Medium
MU
Avatar Text Large
MU
Avatar Text XLarge

Avata groups

+5
Avatar Group Small
+5
Avatar Group Medium
+5
Avatar Group Large

Avatar label groups

Jane Palmer
Global Director, Soundora
Avatar Label Group Small
Jane Palmer
Global Director, Soundora
Avatar Label Group Medium
Jane Palmer
Global Director, Soundora
Avatar Label Group Large

Accordions

Do you offer a complimentary trial?

Yes, experience the power of our platform absolutely free for 30 days. Our expert team will assist you in getting started swiftly and seamlessly.

Accordion Basic Left
Do you offer a complimentary trial?

Yes, you can try us for free for 30 days. If you want, we’ll provide you with a free, personalized 30-minute onboarding call to get you up and running as soon as possible.

Accordion Ghost Left
Do you offer a complimentary trial?

Yes, you can try us for free for 30 days. If you want, we’ll provide you with a free, personalized 30-minute onboarding call to get you up and running as soon as possible.

Accordion Basic Right
Do you offer a complimentary trial?

Yes, you can try us for free for 30 days. If you want, we’ll provide you with a free, personalized 30-minute onboarding call to get you up and running as soon as possible.

Accordion Ghost Right
Do you offer a complimentary trial?

Yes, you can try us for free for 30 days. If you want, we’ll provide you with a free, personalized 30-minute onboarding call to get you up and running as soon as possible.

Accordion Divider Left
Do you offer a complimentary trial?

Yes, you can try us for free for 30 days. If you want, we’ll provide you with a free, personalized 30-minute onboarding call to get you up and running as soon as possible.

Accordion Card Left
Do you offer a complimentary trial?

Yes, you can try us for free for 30 days. If you want, we’ll provide you with a free, personalized 30-minute onboarding call to get you up and running as soon as possible.

Accordion Divider Right
Do you offer a complimentary trial?

Yes, you can try us for free for 30 days. If you want, we’ll provide you with a free, personalized 30-minute onboarding call to get you up and running as soon as possible.

Accordion Card Right

Checkmark items

All features and premium support
Checkmark Primary Solid Small
All features and premium support
Checkmark Primary Solid Medium
All features and premium support
Checkmark Primary Solid Large
All features and premium support
Checkmark Primary Faded Small
All features and premium support
Checkmark Primary Faded Medium
All features and premium support
Checkmark Primary Faded Large
All features and premium support
Checkmark Primary Outline Small
All features and premium support
Checkmark Primary Outline Medium
All features and premium support
Checkmark Primary Outline Large
All features and premium support
Checkmark Neutral Solid Small
All features and premium support
Checkmark Neutral Solid Medium
All features and premium support
Checkmark Neutral Solid Large
All features and premium support
Checkmark Neutral Faded Small
All features and premium support
Checkmark Neutral Faded Medium
All features and premium support
Checkmark Neutral Faded Large
All features and premium support
Checkmark Neutral Outline Small
All features and premium support
Checkmark Neutral Outline Medium
All features and premium support
Checkmark Neutral Outline Large
All features and premium support
Checkmark Success Solid Small
All features and premium support
Checkmark Success Solid Medium
All features and premium support
Checkmark Success Solid Large
All features and premium support
Checkmark Success Faded Small
All features and premium support
Checkmark Success Faded Medium
All features and premium support
Checkmark Success Faded Small
All features and premium support
Checkmark Success Outline Small
All features and premium support
Checkmark Success Outline Medium
All features and premium support
Checkmark Success Outline Large

Social icons

Social Icon Facebook
Social Icon Twitter
Social Icon Instagram
Social Icon Linkedinin
Social Icon Google
Social Icon Youtube
Social Icon Apple
Social Icon Snapchat
Social Icon Pinterest
Social Icon Github
Social Icon Slack
Social Icon Figma
Social Icon Dribbble
Social Icon Reddit
Social Icon Discord
Social Icon Tiktok
Social Icon Tumblr
Social Icon Telegram
Social Icon Clubhouse
Social Icon Signal
Social Icon Angel
Social Icon Notion
Social Icon Neutral Facebook
Social Icon Neutral Twitter
Social Icon Neutral Instagram
Social Icon Neutral Linkedin
Social Icon Neutral Google
Social Icon Neutral Youtube
Social Icon Neutral Apple
Social Icon Neutral Snapchat
Social Icon Neutral Pinterest
Social Icon Neutral Github
Social Icon Neutral Slack
Social Icon Neutral Figma
Social Icon Neutral Dribbble
Social Icon Neutral Reddit
Social Icon Neutral Discord
Social Icon Neutral Tiktok
Social Icon Neutral Tumblr
Social Icon Neutral Telegram
Social Icon Neutral Clubhouse
Social Icon Neutral Signal
Social Icon Neutral Angel
Social Icon Neutral Notion
Social Icon White Facebook
Social Icon White Twitter
Social Icon White Instagram
Social Icon White Linkedin
Social Icon White Google
Social Icon White Youtube
Social Icon White Apple
Social Icon White Snapchat
Social Icon White Pinterest
Social Icon White Github
Social Icon White Slack
Social Icon White Figma
Social Icon White Dribbble
Social Icon White Reddit
Social Icon White Discord
Social Icon White Tiktok
Social Icon White Tumblr
Social Icon White Telegram
Social Icon White Clubhouse
Social Icon White Signal
Social Icon White Angel
Social Icon White Notion