Nocra UI kit for Figma: AI product design system
Nocra UI kit for Figma: ready templates, components and styles for AI SaaS, chat apps and dashboards.
1200+ components
Token-based, auto-layout components with variants, ready patterns for fast AI product UI.
22 pre-built animations
Loaders, thinking states, success and error motions, polished microinteractions for demos.
Light & dark themes
Instant theme toggle via tokens, consistent contrast, scalable styling across every screen.
44+ full-screen templates
Complete AI app screens: onboarding, chat, dashboards, library, settings, payments, flows.
Preview Nocra templates
Preview more Nocra design assets
Style selection
Action menu
Accordion select component
AI status panel
Cards dark theme
Cards dark theme
Alert components
Button group or Segmented controls
Cards variations
Dropdown menu
Cards dark theme
List items widget
Badges dark theme
List item components
List items widget
Cards dark theme
Numeric sliders
Cards variations in dark theme
More dark cards
Prompt history widget
Prompts input widgets
Prompt history
Promo card sample
Badge components
Prompt widgets
Prompt inputs dark
Tooltip variations
Prompt inputs
Side navigation drawer with marketing asset
Side navigation dark theme
Side navigation dark theme widgets
Prompt widgets combinations
Top navigation toolbars
Navigation tab components
Widget with thumbnails list items
Toggle switches
Get started⚡
Nocra UI kit for Figma
Save countless hours with ready-made components, intuitive screens, and stunning animations. NOCRA empowers you to go from concept to clickable prototype in minutes, not days — so you can launch faster, innovate smarter, and outpace the competition.
Aurora Bundle ✦ Orion + Eclipse + Hyper ✦ Save 30%
Aurora Bundle combines Orion, Eclipse, and Hyper Charts for Figma dashboards: 50+ chart templates, 200+ widgets, 1000+ editable graphs, 74 screen templates, 30% savings for data-driven teams today.
Hire us to custom design & code! Let's build together ✊
FAQs
How to start with this design system?
After the successful purchase via Gumroad (it's safe and encrypted) you will be taken to a download page. You will also get the download link in your email (check the SPAM folder sometimes). Then just simply drag and drop .FIG file onto your Figma app. Do not drop it onto the project. Drop it over the starting screen with recent projects grid.
l am new to Figma. Should I try your kits?
Definitely! Our products help customers who learning Figma from scratch. By exploring and studying commercial UI kits you learn how the components and layouts were crafted, which styles being used and which styling tricks have been applied.
How to import your kits?
Importing .FIG files into Figma: https://help.figma.com/hc/en-us/articles/360041003114-Import-files-to-the-file-browser
Which license type should I choose?
You must select the proper license type according to the number of users in Figma if you're purchasing our product for the business.
Business license — for startups or enterprise organizations to use for a local team or publish in Figma library.
Individual license — for freelancers, indie developers, or solopreneurs working on a single project.
Can I build commercial proiects with your products?
Yes! You can build an unlimited amount of commercial projects using Setproduct assets. But, please, consider a license type before making a purchase.
I have a project. Can I hire you?
We're open-minded to your custom design & development projects. We can create complex templates based on our Figma libraries and code them in the production using a wide variety of popular frameworks and technologies.
If you have a project to design & develop, simply contact us describing your brief, budget, and expectations.
I 💜 Your designs, but can I have a discount?
We provide discounts for those, who scrolled to the bottom and revealed our proposal. Just drop us a message with a short story about how you plan to use our product and we will give you a ✨30% off coupon for the upcoming purchase. Please, provide a specific product name you've put your eye on.
