Design System

screenshot of Design System
styled-components

Strapi.io's design system :rocket:

Overview:

The Strapi Design System is a resource provided by Strapi Solutions SAS that offers guidelines and tools to enhance the cohesiveness of Strapi's contributions and streamline the building of plugins.

Features:

  • Discord Shield: The Strapi Design System includes a Discord Shield feature that allows users to connect and collaborate with others in the Strapi community.
  • Installation: The installation process for the Strapi Design System is straightforward and includes installing the system itself along with its peer dependencies.
  • Getting Started: Users are guided through the process of wrapping their applications with the DesignSystemProvider and provided with default values for themes and locales. Additionally, complete documentation is available for users to explore the available components and their usage.
  • Contributing: The Strapi Design System has CONTRIBUTING guidelines in place for users who wish to contribute to the project.
  • License: The system is licensed under the MIT License, with copyright held by Strapi Solutions SAS.
styled-components
Styled Components

Styled Components is a popular library for styling React components using CSS syntax. It allows you to write CSS in your JavaScript code, making it easier to create dynamic styles that are specific to each component.

eslint
Eslint

ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.

typescript
Typescript

TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.