Premium Design System Features for styleframe

Build beautiful, fluid responsive design systems with mathematical precision. Premium composables and advanced features built on styleframe's type-safe API.

Homepage · Documentation · License

styleframe Pro

Premium composables and advanced features for professional design systems.

Styleframe Pro eliminates the complexity of traditional responsive design with fluid scaling, mathematical precision, and production-ready tools. Build faster, ship better.

✨ Premium Features

• 🌊 Fluid Responsive Design - Create designs that scale smoothly across all viewport sizes using mathematical precision. No more breakpoints.
• 💎 Premium Composables - Advanced design system tools built on styleframe's type-safe API. Production-ready, fully tested.
• ∞ Unlimited Projects - Use styleframe Pro on unlimited personal and commercial projects. Build websites, apps, and client work.
• 🛡️ Commercial License - Covers client projects, SaaS applications, and commercial websites. Redistribution requires a builder license. Learn more
• ⚡ Performance Optimized - Smaller CSS bundles mean faster page loads. All composables are optimized for best performance.
• 📖 Complete Documentation - In-depth guides, examples, and best practices. Get up and running in minutes.

🚀 Quick Start

Pre-requisites

Styleframe Pro requires the core styleframe package:

# npm
npm install styleframe

# pnpm
pnpm add styleframe

# yarn
yarn add styleframe

# bun
bun add styleframe

Installation

# npm
npm install @styleframe/pro

# pnpm
pnpm add @styleframe/pro

# yarn
yarn add @styleframe/pro

# bun
bun add @styleframe/pro

License Activation

Styleframe Pro is free in development mode - try it without a license key!

Development environments (local development) can use styleframe Pro free of charge.

1. Activate your license key by logging into your account and submitting it into the form. You can find your license key in your email receipt or in your account dashboard.

2. Set your license key as an environment variable:

# Set your license key
export STYLEFRAME_KEY=your_license_key_here

Note: styleframe Pro may display watermarks or console warnings when used in production without a valid license key.

📚 What's Included

Starting with fluid responsive design — the foundation of modern, scalable design systems — with many more premium composables on the way:

• Fluid Design System - Based on Utopia's mathematical principles
• Fluid Clamp - Smooth scaling between min/max values
• Fluid Spacing - Typography and layout that adapt perfectly
• More premium features coming soon!

📖 Documentation

• Getting Started - Learn the basics
• Fluid Design - Complete guide to fluid responsive design
• Fluid Clamp - Learn about fluid scaling
• API Reference - Complete API documentation
• Pro Features - Learn about all Pro features

🤝 Community

• Discord - Chat with the community
• GitHub Issues - Report bugs or request features
• Discussions - Ask questions and share ideas

📋 License

Styleframe Pro requires a license for production use. View license terms →

Free in Development - Try styleframe Pro for free in development mode, no credit card required. Upgrade when ready to deploy.

Commercial Use - Your license covers:

• Unlimited personal and commercial projects
• Client work and custom websites
• SaaS applications
• Open source projects

One License, Unlimited Projects - Build as many sites as you want without purchasing additional licenses.

Purchase another license → | Contact us about Builder License →