DesignCode UI
Open siteCoding & Development
Introduction
Customizable UI components for Figma and Framer.
DesignCode UI Product Information
DesignCode UI is a comprehensive design system and UI kit for Figma and Framer that provides hundreds of UI components, templates, and variants to accelerate building beautiful, functional websites and apps. The kit emphasizes theming, consistency, and adaptability, with a focus on a glassy, modern aesthetic that leverages Figma Variables and Framer integration for seamless design-to-development workflows. It includes a expansive collection of fully designed components, layouts, and templates designed to work together across projects, with daily updates and flexible licensing.
How It Works
- Access a complete library of 300+ components, 2,000+ Figma variants, and 2,116 unique icons.
- Use Figma Variables and Framer true implementations to create consistent, adaptive design systems.
- Browse and apply UI templates and presets for rapid prototyping and production-ready designs.
- Download Figma and Framer files, manage licenses, and stay up-to-date with daily updates.
Features
- Extensive UI component library (buttons, menus, controls, layouts, etc.)
- Theming support with light/dark modes and configurable variables
- Fully designed components tailored for Figma and Framer projects
- 260+ components across multiple categories (Buttons, Controls, Menus & Content, etc.)
- 2,116 unique icons and 2,000+ Figma variants
- Auto Layout, responsive breakpoints, and adaptive layouts
- Glass, Line, Flat styling options with CSS/React/Tailwind compatibility
- Daily updates and Lifetime updates for certain plans
- Licenses tailored for single users and teams, with flexible pricing
How to Use DesignCode UI
- Browse the catalog of components and templates in Figma.
- Choose a base UI kit variant (Glass, Outline, Flat) and apply it across your project.
- Use Figma Variables to manage colors, spacing, and themes; implement with Framer for interactive states.
- Export assets or hand-off to development with Framer/Code integrations.
Pricing & Plans (Examples)
- Basic: Free preview with limited components and variants.
- All-Access: One-time, 50% off on 300+ components, 2,000+ Figma variants, 2,116 icons, lifetime updates, single user.
- Team: One-time, 50% off, same scope as All-Access but for teams (up to multiple users).
- Subscriptions may offer ongoing access and updates; some plans support PayPal for initial purchases with non-renewal terms.
Safety and Licensing
- Designed for commercial use under license codes provided after purchase.
- Licenses restrict redistribution of the core product but allow use across projects.
- Daily updates keep components aligned with current design trends and technologies.
Core Features
- Extensive UI component library (300+ components)
- 2,000+ Figma variants and 2,116 unique icons
- Theming with light/dark modes and configurable Variables
- True Framer integration for interactive prototyping
- Fully designed components and templates for rapid project setup
- Auto Layout, responsive design, and adaptive layouts
- Glass, Line, and Flat styling options with CSS/React/Tailwind compatibility
- Lifetime updates and team licensing options
- Daily component updates and license management
What makes DesignCode UI unique
- A cohesive, themable design system that ensures visual consistency across projects.
- Deep integration with Figma Variables and Framer for realistic, production-grade workflows.
- Rich collection of templates and presets that accelerate design and handoff.