Kristin Watson
kristin.watson@appwrite.io
Pink Design
Design. Build. Collaborate.
Pink Design is Appwrite's open-source design system for building consistent and reusable user interfaces. Pink is designed to prioritize collaboration, dev experience, and accessibility.
Header
#F02E65
100%
RR
<td class="table-col" data-title="Name">
<div class="u-inline-flex u-cross-center u-gap-12">
<span class="avatar is-color-pink">RR</span>
<!-- ... -->
</div>
</td>
<!-- ... -->
<td class="table-col" data-title="Name">
<div class="u-inline-flex u-cross-center u-gap-12">
<div class="avatar">
<img src="/jenny.jpg" alt="JW" />
</div>
<!-- ... -->
</div>
</td>
$ git commit| Name |
|---|
RR
Ronald Richards
ronald@appwrite.io |
Jenny Wilson
jenny@appwrite.io |
Design
Design and create simple, consistent and user friendly features when contributing to Appwrite, or use our components for your own products
- Fully accessibile
- Light and dark mode support
- Optimized for Dev tooling
Build
Design system created with developer experience in mind, with support of our internal developer team
- Easy to integrate with your preferred framework
- Only one CSS file is needed
npm install "@appwrite.io/pink"
import "@appwrite.io/pink";
Collaborate
One (open) source of truth for collaborating with others on Appwrite, or your own products
- Documentation and tips on usage of components
- Fully open source
- Collaborate with us in Discord and GitHub
#F02E65
100%
$ git commit
Try It Out Yourself
Articles
-
Announcing Pink Design
Building software is fun. Building open source software is even better. At Appwrite, open source is at the core of everything we do...
3 min read -
Getting Started with Pink Design
Pink Design is Appwrite's Open Source design system for building consistent and reusable user interfaces...
2 min read -
CSS Layers for CSS Resets
I have always been one of those people who preferred the aggressive CSS reset methods. These methods delete most of the default styles of the browser...
7 min read
Join Our Growing Developer Community
Design and develop with us the best developer experience out there!
