Skip to content
Primio Docs

Design Library

The Design Library provides 12 pre-built visual themes you can apply to your app. Each one is a cohesive style covering colors, shapes, shadows, and overall aesthetic — giving you a professional-looking app without describing every design detail yourself.

How to use it

Section titled “How to use it”

When creating a new project, click the dedicated Design button to open the Design Library. Browse the styles in a carousel with screenshot previews, then click Use this design to apply the one you want.

The AI applies the selected style across your app’s screens, adjusting colors, typography, spacing, and component styling to match the theme.

Available styles

Section titled “Available styles”

Tier 1 — Flutter Showcase

Section titled “Tier 1 — Flutter Showcase”
  • Glassmorphism — Frosted glass effects with translucent overlays and blur
  • Aurora Gradient — Flowing, colorful gradient backgrounds with smooth transitions
  • 3D Depth — Layered elements with pronounced shadows and depth perception
  • Liquid Organic — Soft, flowing shapes with rounded, organic elements
  • Neumorphism — Soft, extruded UI elements that appear to push out of the background
  • Gradient Glow — Vibrant gradients with glowing, luminous accents

Tier 2 — Most Popular

Section titled “Tier 2 — Most Popular”
  • Dark Minimal — Sleek dark interface with near-black backgrounds and one accent color
  • Clean Minimal Light — Bright, airy design with white backgrounds and subtle shadows
  • Material 3 — Google’s latest Material Design with dynamic tonal color palettes
  • iOS-Inspired Clean — Apple-inspired design with large bold titles and minimal shadows

Tier 3 — Other

Section titled “Tier 3 — Other”
  • Soft & Colorful — Friendly pastel colors with large rounded corners
  • Bold Dark — High-impact dark theme with oversized typography and dramatic contrast

Tips for best results

Section titled “Tips for best results”

Use it in your first prompt. Design styles can only be applied when creating a new project. Since the Design Library is part of the project creation flow, choose your style before you start building. You cannot apply a design style to an existing project.

It’s a starting point. The design is not a constraint. After applying a style, you can freely customize colors, fonts, spacing, and individual components through follow-up prompts. The style sets the foundation; you refine from there.

Combine with gradients. Use the Gradient Builder to create custom gradient effects that complement your chosen design style.

Describe what you want to change. After applying a style, be specific about adjustments: “Keep the glassmorphism style but make the primary color teal instead of blue” works better than “change it a bit.”

Next steps

Section titled “Next steps”