Pigment.v0.1.0

Introduction

Pigment is an open source design system for SolidJS, built with Kobalte and Tailwind CSS. It provides a set of ready-to-use components for building web applications with a consistent look and feel.

Why a design system ?

First of all, if you are a designer looking at this, you are surely telling yourself "wait, this is not a design system"...and you're right 😅.

A design system is much more than a set of component implemented in a particular technology. However, I use the term design system to make it clear that this is NOT a multipurpose, generalist, component library.

What does this mean ?

  • It's opinionated: Several design decisions have been made to make the components accessible, consistent and easy to use. This mean you may face behaviors that you disagree with but that cannot be changed.

  • It's not highly customizable: For sure there is a theming API to make the components fits your brand, but this is not the main goal of the library. This mean you may find components that you will not be able to customize exactly like you want. If your customization requirements go beyond changing the color palette and want full control over the appearance, I recommend using a headless library like Kobalte.

  • It does not contain dozens of component variants: In most component libraries you will find an incredible amount variant, size and color options for buttons, alerts, badges, so on and so forth. Pigment contains only the minimum necessary to allow you to create consistent user interfaces.

  • It's not a one-size-fits-all solution: The purpose of this library is not to be "the" component library for SolidJS and try to solve everyone's problems. I strongly believe that the ideal UI library is the one that you have built yourself. However, if you like the visual style and the API, I think Pigment is a good option for prototypes, MVPs, and for developers without design skills to produce attractive and accessible user interfaces.

Acknowledgment

Next
Getting started
Pigment.
Made in 🇫🇷 by Fabien MARIE-LOUISE.
Community