BWDC UI Kit

While freelancing I had the opportunity to help work on an UI kit for Black Wealth Data Center. Their website had some inconsistencies, so we built a UI kit that is consistent and uses simple and easy to use components.

Accordions • Back to Top • Buttons • Cards Dropdown • Chart PlaceHolder • Footer • Icons • Input, Search Fields & Forms • Link • Navigation • Pagination • Patterns • Radio Buttons • Tables • Tabs • Tags

Components were asked to be built out without using variables.

Components

Specs & Documentation

Along with the UI kit we provided BWDC with color and type style tokens and documentation around the components with how they are used and built.

We used a 4-pixel base unit which allows components to scale consistently across all display sizes. For the grids we used a 12-column grid on desktop and 4 on mobile.

Mocks

Mocks built using the UI kit we built.

Previous
Previous

Shuddle Design System

Next
Next

Animated Banner Design System