Appwrite Theme

Craft

npx shadcn add https://try.pungrumpy.com/r/appwrite-theme.json

An appwrite.ioappwrite.io-inspired theme featuring the signature Appwrite Pink #FD366E with modern developer aesthetics for cloud-native applications.

Light

Appwrite theme

Cloud Functions

Deploy serverless functions in 30+ runtimes

Active functions12
Total executions1.2M
Avg. response time142ms
Accent ladder

Dark

Appwrite theme

Cloud Functions

Deploy serverless functions in 30+ runtimes

Active functions12
Total executions1.2M
Avg. response time142ms
Accent ladder

How It Works

The theme draws inspiration from Appwrite's modern developer platform aesthetic, featuring the signature Appwrite Pink #FD366E as the primary brand color. The design emphasizes clarity and professionalism with a focus on developer tools and cloud infrastructure interfaces.

Light mode uses clean light greys #EDEDF0 with the vibrant pink accent, while dark mode provides deep dark backgrounds #19191D with bright pink accents that maintain excellent contrast. The --radius of 0.5rem provides gentle rounded corners that feel modern without being overly soft.

Token groups are organized for comprehensive UI coverage: backgrounds, cards, popovers, code blocks, sidebars, and charts. The pink accent colors create a cohesive developer-focused experience that feels both professional and approachable, true to Appwrite's brand identity.

Usage

Install the theme and include the generated CSS in your base styles. Apply the dark class on the root element to toggle dark mode. All components inherit tokens automatically, maintaining visual consistency across your application.

Was this helpful?