Getting Started
Pink Design is Appwrite's open-source design system for building consistent and reusable user interfaces. Follow the steps below to start building with Pink Design.
CDN
Include the CSS library in your project
Copy the following code into the
<head>
section of your HTML file.<link rel="stylesheet" href="https://unpkg.com/@appwrite.io/pink" />
<!-- optionally, add icons -->
<link rel="stylesheet" href="https://unpkg.com/@appwrite.io/pink-icons" />
NPM
Install the CSS library
Run the following command to install Pink Design as an NPM package.
npm install @appwrite.io/pink
Include the library in your project
After installing Pink Design as a package, it will be added to the
node_modules
directory of your project. Include Pink Design as CSS library by importing it in your JavaScript files.import "@appwrite.io/pink";
// optionally, add icons
import "@appwrite.io/pink-icons";