1.1 Accessing Your Files
After checkout, you’ll receive:
A downloadable ZIP inside your inbox
A LemonSqueezy / Polar “Library” link with lifetime file access
Direct Figma file links for each product
To begin:
Open the product link
Click “Duplicate to Drafts”
Move it into your project folder
Start customizing components or screens
1.2 File Requirements
Every UxSculpt product follows a predictable structure so teams can work consistently. Here’s the breakdown:
2.1 Styles
Contains all design tokens:
Color Styles (Primary, Gray, Surface, State, Accent)
Typography Styles (Display, Headings, Body, Label)
Direct Figma file links for each product
Grid + Layout (Spacing, Columns, Sections)
Example:
/Styles
/Colors
/Typography
/Border Radius
/Elevation
/Spacing
2.2 Components
Built with:
Auto Layout 5.0
Smart variants
Min–max constraints
Swap instances
Categories include:
Buttons
Inputs
Badges
Nav & App Bars
Pagination
Avatars & Chips
Tables & Charts
Cards & Sections
Form Elements
Each component has variants like:
Size (S / M / L)
State (Default, Hover, Pressed, Disabled)
Style (Solid, Outline, Ghost)
2.3 Screen Templates (UI Kits)
Every UI kit includes:
Authentication screens
Dashboards
Settings & Billing
Onboarding
Analytics
Chat/AI screens
Product layouts
Each screen is built using the same design tokens so you can shuffle, remove, or replace without breaking visual consistency.
2.4 Asset Library
Depending on the product:
SVG Icon Set
Brand Logicons
Country Flags
Illustrations
Cards, shadows, and media placeholders
3.1 Adapting UI Kits to Your Brand
To rebrand quickly:
Open
/Styles → ColorsReplace Primary, Surface, Accent tokens
Update Font Family in
/TypographyUI updates everywhere instantly
Because all components reference tokens → no manual editing needed.
3.2 Working With Screen Blocks
Each screen is built using “Blocks,” such as:
Hero Sections
Pricing Sections
Feature Grids
Navigation Blocks
Cards
You can:
Drag blocks into new frames
Replace components
Change layouts without breaking alignment
Reapply Auto Layout for responsiveness
3.3 Editing Variants
Example for a Button component:
Select the button
Switch Variant → "Solid / Medium / With Icon"
Replace icons, hide text, or resize freely
Everything snaps automatically.
Widgets are smaller building blocks used inside dashboards and apps.
4.1 Fintech Widgets
Includes:
Transaction blocks
Balance cards
Payment tiles
Analytics charts
User account modules
Best practices:
Keep spacing locked to the 8pt grid
Avoid resizing widgets randomly
Swap content using Smart Layout
4.2 Universal SaaS Components
These are universal across industries:
Tables
Filters
Empty states
Dialogs
Tooltips
Navigation
Pagination
They are atomic — mix and match them to build entirely new screens.
Logicons are brand icons (Payments or Tech).
Each icon is:
Vector
Grid-aligned
Comes in 8–12 variants
Exportable as SVG
5.1 Applying Logicons in UI
Use for:
Payment methods
Brand integrations
Logos in dashboard lists
Feature icons
App previews
Avoid:
Large hero illustrations
Logo-dependent assets (brand misuse)
6.1 Free UI Icons
Includes:
100 essential UI icons
Outline + Solid
24px Base grid
Best use cases:
Buttons
Toolbars
Modals
Mobile menus
6.2 Flag Icons
Includes:
200+ country flags
Square + Rounded + Circular
Perfect for:
Language switchers
Country dropdowns
Checkout forms
7.1 Figma Setup
Enable “Auto Layout” preview
Turn on “Pixel Preview”
Use Sections to group screens
Use nested Auto Layout for responsive resizing
7.2 Naming & Organization
Keep naming consistent:
button/solid/medium
modal/payment-success
input/textfield/search
7.3 Performance Tips for Large Files
Collapse layers
Turn off shadows during editing
Avoid multiple open pages
Keep image sizes low
Free License
Limited files
Personal use only
Credit required
Pro License
Full product access
Commercial use
1 designer seat
Lifetime updates
Team License
Up to 10 designers
Unlimited client use
Faster future updates
Priority support
Full license terms available on Licensing page.
Common Issues
1. Components not resizing correctly
Usually caused by:
Manual overrides
Broken Auto Layout
Locked constraints
Reset → “Restore Instance” or detach & reapply.
2. Page lagging
Break large pages into Sections.
3. Icons not recoloring
Set to “CurrentColor” or ensure vector layers aren’t “mixed fill.”
UxSculpt products receive:
New screens
New widgets
Extra icon variants
Bug fixes
Structure improvements
Updates are documented in the Changelog with:
Version number
Date
What’s new
What changed
What was fixed
Links you can add:
Figma Auto Layout Guides
Official Figma Variants Tutorial
Icon Design Handbook
Figma Tokens Plugin
UxSculpt Blog (future)
Email support
Contact form
Join Affiliate Program
Social media links
