A Perfect Design System for Bootstrap 5+ Series
Atomic Design Mindset with Smart Implementation, you will never have to detach any instance, but still can have flexible content inside(even with complex structure) and keep all the design consistent, easy to maintain.
Carefully built with pixel perfect and super flexible to use, follow exactly newest Bootstrap document and guideline
for design and development.
-
COMPLETELY FREE
– but –
VALUABLE
–
Thousands hours spent
, this Design System will save you much of time to craft new one. Kick start your next design with perfect pixel in no time. -
Newest
Bootstrap v5.1
-
Cover 100%
Bootstrap Components
– Naming convention with description/guide on each component, easy to find and add to design. -
All Component Variants
included, follow exactly
Bootstrap CSS class/Options
, well organized and consistent, ready to use and easy to
handover
to developer. -
Pixel-perfect
– We care every single pixel to make it perfect match with Bootstrap original design. -
Coding mindset
– We really think about the implementation when creating the Design System, that’s why we read every single line of Bootstrap document, css class, component options. To make sure the design is easily to implement and the implementation can follow exactly the design. -
Fully
Auto Layout (Latest version)
to make whole Design System super flexible, speed up the design process. -
Responsive
– All components are resizable. -
Interactive
Components – Click on Present ▷ on each page to see examples with Ready Interactive Components. Easy to present to stakeholders and reference for developer. -
Detailed Document
with
Example
included for every single component -
Atomic Design
Mindset, well organize components and atoms. Bootstrap grids, colors, typography, all components are included and ready to use. -
Easy to customize
– Everything in Design System is easily to change: color, typography, border radius,… and the changes will be instantly applied across whole the system. -
UI Kit
-
Continuous updated
💪🏻 Does this Design System save your time?
This Design System made with ❤ and thousands hours spent. Support to make it better!
———-
08 May 2022
- Typography updated
19 Apr 2022
- Minor fixes
04 Apr 2022
- Table updated
- Other minor fixes
13 Mar 2022
- Update Date & Time Picker Prototype that stop to add Button to this page
- Other minor changes
20 Feb 2022
- Update Bootstrap Icons to v1.8.1
16 Jan 2022
- Add sample user avatar
- Update Bootstrap Icons to v1.7.2
- Add Grid sample pages
01 Dec 2021
- Full Button Variants
- Update Table with more flexible structure and easier to use
- Color picker with Up/Down position of dropdown picker
29 Nov 2021
- Flatten Icon Vectors
- More Button Variants
- Date/Time Picker, Select now have better dropdown interactions
- Form updated with tooltip icon and better structure
- All form fields now have valid/invalid status with interactions
- Other minor bugs fixed
———-
Components
General:
- Colors
- Typography
- Bootstrap Icons
Main Components:
- Accordion
- Alerts
- Badge
- Breadcrumb
- Buttons
- Button group
- Card
- Carousel
- Close button
- Collapse
- Dropdowns
- Divider
- List group
- Modal
- Navs & tabs
- Navbar
- Offcanvas
- Pagination
- Placeholders
- Popovers
- Progress
- Scrollspy
- Spinners
- Toasts
- Tooltips
Form:
- Select
- Checks & Radios & Switch
- Color Picker
- Datalist
- Input
- Input Number
- Range
- Rate
- Select
- Transfer
- Upload
Content:
- Images
- Tables
- Figures
Extra:
- Avatar
- Comment
- Empty
- Tags
———-
Built with ❤ and a lot of ☕
