UI Kit
Create report
4
John Carter Avatar - Dashbrd X Webflow Template
Primary colors
Accent
#1A68FF
Secondary colors
Secondary 100
#050811
Neutral colors
Neutral 800
#0A0E1A
Neutral 700
#151B2D
Neutral 600
#26304A
Neutral 500
#A8B2D2
Neutral 400
#C9CFE5
Neutral 300
#C9CFE5
Neutral 200
#EAF0FF
Neutral 100
#FFFFFF
System colors
Red 400
#FF3232
Red 300
#FB93A3
Red 200
#FAC6D0
Red 100
#FFF5F6
Greenl 400
#00D971
Green 300
#ADECBB
Green 200
#E2FBEA
Green 100
#EEF9F5
Text style
Size
Line Height
Weights
Display 10
54px
1.115em
Default
Mid
Strong
Display 9
48px
1.115em
Default
Mid
Strong
Display 8
36px
1.125em
Default
Mid
Strong
Display 7
28px
1.125em
Default
Mid
Strong
Display 6
22px
1.125em
Default
Mid
Strong
Display 5
18px
1.125em
Default
Mid
Strong
Display 4
16px
1.125em
Default
Mid
Strong
Display 3
14px
1.125em
Default
Mid
Strong
Display 2
12px
1.125em
Default
Mid
Strong
Display 1
10px
1.125em
Default
Mid
Strong

Paragraph Large - Gravida vulputate scelerisque dui at aliquam at. Nec purus nisl a tellus velit tellus.

14px
1.5em
Default
Mid
Strong

Paragraph Default - Gravida vulputate scelerisque dui at aliquam at. Nec purus nisl a tellus velit tellus.

12px
1.5em
Default
Mid
Strong

Paragraph Small - Gravida vulputate scelerisque dui at aliquam at. Nec purus nisl a tellus velit tellus.

10px
1.5em
Default
Mid
Strong
Primary button
Small
Default
Small
Default
Text
Icon
Number
Text
Icon
Number
Default
1
Default
1
Default
1
Default
1
Circle avatars
Default
28px
32px
40px
64px
80px
John Carter Avatar - Dashbrd X Webflow Template
John Carter Avatar - Dashbrd X Webflow Template
John Carter Avatar - Dashbrd X Webflow Template
John Carter Avatar - Dashbrd X Webflow Template
John Carter Avatar - Dashbrd X Webflow Template
Avatar photos (replace)
John Carter Avatar - Dashbrd X Webflow Template
Sophie Moore Avatar - Dashbrd X Webflow Template
Lilly Woods Avatar - Dashbrd X Webflow Template
Andy Smith Avatar - Dashbrd X Webflow Template
Kathie Corl Avatar - Dashbrd X Webflow Template
Patrick Meyer Avatar - Dashbrd X Webflow Template
Sandy Houston Avatar - Dashbrd X Webflow Template
Avatars in row
John Carter Avatar - Dashbrd X Webflow Template
Sophie Moore Avatar - Dashbrd X Webflow Template
Lilly Woods Avatar - Dashbrd X Webflow Template
Andy Smith Avatar - Dashbrd X Webflow Template
Kathie Corl Avatar - Dashbrd X Webflow Template
+3
Input text
Small
Default
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Small
Default
Text Area
Small
Default
Small
Default
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Checkboxes
Active
Inactive
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Radio buttons
Active
Inactive
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Toggle Button
Active
Inactive
Placeholder
Placeholder
Placeholder
Placeholder
Upload
Image Square Icon - Dashbrd X Webflow Template
Click to upload or drag and drop
SVG, PNG, JPG or GIF (max. 800 x 400px)
Badges
Progress
Status
Progress
Status
Small
Default
Default
Default
Default
Default
Default
Default
Default
Default
Category
Development Icon - Dashbrd X Webflow Template
Development
Design Icon - Dashbrd X Webflow Template
Design
Marketing Icon - Dashbrd X Webflow Template
Marketing
Marketing Icon - Dashbrd X Webflow Template
Social media
Utility Icon - Dashbrd X Webflow Template
Search engine
Streaming Icon - Dashbrd X Webflow Template
Streaming
Sidebar items
Dropdown
Cards
John Carter Avatar - Dashbrd X Webflow Template
John Carter
@johncarter
Email Icon - Dashbrd X Webflow Template
Email address
hello@johncarter.com
Phone Icon - Dashbrd X Webflow Template
Phone
(414) 907 - 1274
Location Icon - Dashbrd X Webflow Template
Location
New York, NY
Briefcase Icon - Dashbrd X Webflow Template
Company
Facebook Logo - Dashbrd X Webflow Template
Facebook
Facebook Logo - Dashbrd X Webflow Template
Facebook
Social media
Location Icon - Dashbrd X Webflow Template
Location
United States
Phone Icon - Dashbrd X Webflow Template
Phone
(414) 907 - 1274
Website Icon - Dashbrd X Webflow Template
Website
facebook.com
Facebook Logo - Dashbrd X Webflow Template

Facebook

Lorem ipsum dolor sit amet consectetur eu augue mattis vulputate elit ut pellentesque lorem.

Social media
Notifications
Info
Success
Error
Warning
Info
Success
Error
Warning
Notification V1
Notification V2
Notification title
Notification title
Notification title
Notification title
Notification title

Dolor sti vitae vestibulum elit leo variusdool

Notification title

Dolor sti vitae vestibulum elit leo variusdool

Notification title

Dolor sti vitae vestibulum elit leo variusdool

Notification title

Dolor sti vitae vestibulum elit leo variusdool

Empty states
Search Square Icon - Dashbrd X Webflow Template
No records available
There are no records here to display
Success Square Icon - Dashbrd X Webflow Template
Action completed!
This action has been completed successfuly!
Dismiss
Error Square icon - Dashbrd X Webflow Template
There’s been an error
There are no records here to display
Search Square Icon - Dashbrd X Webflow Template
No records were found
There are no records here to display
Notification Square Icon - Dashbrd X Webflow Template
Notification alert
There are no records here to display
Preview popups
Are you sure you want to continue?

Lorem ipsum dolor sit amet consectetur in ultrices magna amet tristique nunc sit morbi arcu et dui lobortis facilisis.

Cancel
Continue
Preview popups
Success Square Icon - Dashbrd X Webflow Template
This is a success message

Lorem ipsum dolor sit amet consectetur in ultrices magna amet tristique nunc sit morbi arcu et dui lobortis facilisis.

Dismiss
Success Square Icon - Dashbrd X Webflow Template
This is a success message

Lorem ipsum dolor sit amet consectetur in ultrices magna amet tristique nunc sit morbi arcu et dui lobortis facilisis.

Dismiss
Preview popups
Error Square icon - Dashbrd X Webflow Template
This is an error message

Lorem ipsum dolor sit amet consectetur in ultrices magna amet tristique nunc sit morbi arcu et dui lobortis facilisis.

Dismiss
Error Square icon - Dashbrd X Webflow Template
This is an error message

Lorem ipsum dolor sit amet consectetur in ultrices magna amet tristique nunc sit morbi arcu et dui lobortis facilisis.

Dismiss
Preview popups
Alert Square Icon - Dashbrd X Webflow Template
This is an alert message

Lorem ipsum dolor sit amet consectetur in ultrices magna amet tristique nunc sit morbi arcu et dui lobortis facilisis.

Dismiss
Alert Square Icon - Dashbrd X Webflow Template
This is an alert message

Lorem ipsum dolor sit amet consectetur in ultrices magna amet tristique nunc sit morbi arcu et dui lobortis facilisis.

Dismiss
Preview popups
Message Square Icon - Dashbrd X Webflow Template
Please confirm your account

Lorem ipsum dolor sit amet consectetur in ultrices magna amet tristique nunc sit morbi arcu et dui lobortis facilisis.

Re-send confirmartion email
Preview popups
Alert Square Icon - Dashbrd X Webflow Template
Upgrade your account and get 50% OFF today

Lorem ipsum dolor sit amet consectetur in ultrices magna amet tristique nunc sit morbi arcu et dui lobortis facilisis.

Upgrade account

Explore our collection of 200+ Premium Webflow Templates

Need to customize this template? Hire our Webflow team!