styledsea

Design System

Styledsea design system for building consistent web experiences.

Zeit UI - Overview

Zeit UI is React component library that implements Vercel's Design. It's comprehensive and can be used in production out of the box.

It includes a comprehensive collection of prebuilt components that are ready for use in production right out of the box and features a suite of customization options that make it easy to implement your own custom design system on top of our components.

Accessibility out of the box:

No runtime styles.

Zeit Ui is based on Tailwind CSS, it means that there are no runtime styles, and no unnecessary classes in your bundle.

Multiple packages.

Zeit Ui is divided into multiple packages, so you can install only the components you need.

React server components.

Zeit Ui components already include the "use client" directive, which means you can import and use them directly in your RSC.

Accessible components.

All components follow the WAI-ARIA guidelines, provide keyboard support and sensible focus management.

Supports assistive technology.

Implements correct semantics and behaviors, so it's accessible to people using assistive technology.

Design Principles

The development of Zeit Ui has been guided by a set of specific design and API principles. These principles serve as the foundation for our library and play a crucial role in ensuring the efficiency, effectiveness, and user-friendliness of the components we offer.

Simplicity and Usability

Simplicity is the ultimate sophistication. At Zeit Ui, we believe in delivering simple and intuitive components. Our design process centers around the user, ensuring that we deliver tools that are easy to understand, configure, and implement, regardless of a developer's expertise level.

Modular Design

Each component in Zeit Ui is designed as a standalone module. This modular approach allows developers to import and use only what they need, leading to lighter applications and faster load times.

Through these principles, we aim to make Zeit Ui an effective, efficient, and enjoyable tool for our developers to use. As we continue to expand and enhance Zeit Ui, these guiding principles will remain central to our design and development processes.

Last updated on

On this page

Edit on GitHub