1.0.0
First release. Everything in the ZIP is listed above.
#FFFFFF#E7E1F5#1E1A36#C7C2CE#7666A0
PAL-UI-03 / UI kit / Large
SaaS App Kit
The biggest kit we make: a whole SaaS interface from one set of tokens.
- components
- 167
- screens
- 20
- SVG frames
- 90
Commercial selected, $179
| Personal | Commercial | Extended | |
|---|---|---|---|
| Who can use it | One person | Up to 5 team members | Up to 25 team members |
| Personal projects | Yes | Yes | Yes |
| Client projects | No | Yes, unlimited | Yes, unlimited |
| Free end products | No | Yes | Yes |
| Products where users pay | No | No | Yes |
| Credit required | None | None | None |
None of the licences let you resell or share the files, upload them to a marketplace, or use them to train AI models. Compare licences in full
View live demo
Sample content only. The page is the shipped HTML, nothing added.
- Instant download after payment. Links also arrive by email.
- One-time purchase, no subscription.
- No account. Guest checkout.
- Files
- 379 files
- Formats
- HTML, CSS, SVG frames (vector, text as outlines), PNG frames 1x, CSS tokens
- Built for
- Tailwind CSS v4 · Chrome, Safari, Firefox, Edge (current versions)
- Size
- 16 MB zipped, 53 MB unzipped
- Version
- 1.0.0
USD. Taxes such as VAT, GST or sales tax, where they apply, are added at checkout.
One-time purchase. Licence: Commercial. Read the licence agreement
Digital files can't be returned. If something's broken or missing, we fix it or refund you. Refund policy
You'll pay on Stripe's secure page. We never see your card number.
What it's for
You're building a product, not a page. Inbox, board, billing, onboarding, plans, knowledge base, tables in several moods. When the app grows past ten screens, the thing that breaks is consistency. The design tokens are a single CSS file: change the brand colour there, rebuild the Tailwind CSS, and it changes everywhere.
What's in the ZIP
167 components in 25 groups. 20 screens, light and dark. A design-token CSS file with a documentation page that lists every token in both themes. SVG frames and PNG previews for every screen. 379 files, 16 MB zipped.
Folders on the left are the layers on the right. Counts and sizes are read from the ZIP itself.
components/167 files288 KB
analytics/6 files11 KB
- cohort-grid.html4 KB
- funnel-steps.html936 B
- geo-bars.html2 KB
- leaderboard.html2 KB
- metric-compare.html559 B
- retention-curve.html2 KB
auth/4 files8 KB
- login-card.html2 KB
- reset-card.html1 KB
- signup-card.html2 KB
- twofactor-card.html3 KB
badges/4 files6 KB
- badge-dot.html634 B
- badges-pill-count.html1 KB
- badges-status.html1 KB
- tag-removable.html3 KB
billing/4 files8 KB
- invoice-list.html4 KB
- seat-manager.html2 KB
- upgrade-banner.html1 KB
- usage-meter.html890 B
buttons/6 files8 KB
- button-group.html897 B
- button-icon.html2 KB
- button-loading.html526 B
- button-sizes.html1 KB
- button-split.html777 B
- buttons-variants.html2 KB
charts/13 files31 KB
- chart-area.html2 KB
- chart-bar-horizontal.html2 KB
- chart-bar.html4 KB
- chart-combo.html2 KB
- chart-donut.html2 KB
- chart-funnel.html1 KB
- chart-gauge.html775 B
- chart-heatmap.html4 KB
- chart-line.html3 KB
- chart-multi-line.html2 KB
- chart-radial.html2 KB
- chart-sparkline-row.html1 KB
+ 1 more files
- chart-stacked.html4 KB
collaboration/8 files13 KB
- activity-log.html2 KB
- comment-composer.html3 KB
- comment-thread.html2 KB
- member-row.html1 KB
- notification-item.html1 KB
- presence-avatars.html1 KB
- role-select.html543 B
- share-dialog.html3 KB
commerce/8 files11 KB
- inventory-row.html1 KB
- invoice-table.html2 KB
- order-row-card.html1 KB
- payment-method.html1 KB
- price-input.html1 KB
- product-card.html985 B
- product-media.html2 KB
- shipping-card.html1 KB
data-display/10 files21 KB
- activity-feed.html2 KB
- avatar-stack.html1 KB
- calendar-mini.html8 KB
- description-list.html800 B
- kanban-card.html2 KB
- kpi-row.html944 B
- list-avatar.html2 KB
- order-summary.html797 B
- stepper.html2 KB
- timeline.html1 KB
docs/5 files5 KB
- changelog-entry.html710 B
- code-block.html669 B
- docs-sidebar.html1 KB
- shortcuts-list.html1 KB
- status-row.html1 KB
empty-states/3 files4 KB
- empty-error.html1 KB
- empty-no-data.html1 KB
- empty-search.html1 KB
feedback/10 files14 KB
- alert-banner.html2 KB
- alert-inline.html873 B
- drawer.html2 KB
- modal-confirm.html1 KB
- progress-bars.html1 KB
- skeleton-card.html330 B
- skeleton-table.html1 KB
- spinner.html774 B
- toast-stack.html2 KB
- tooltip-popover.html1 KB
+ 86 more files
filters/4 files6 KB
- filter-chips.html2 KB
- filter-search-bar.html2 KB
- filter-segmented.html1 KB
- filter-select-row.html2 KB
forms/16 files18 KB
- checkbox-radio.html1 KB
- date-range.html826 B
- file-upload.html797 B
- form-card.html2 KB
- form-wizard.html580 B
- input-group.html770 B
- input-otp.html2 KB
- input-text.html486 B
- input-with-icon.html1 KB
- radio-cards.html1 KB
- range-slider.html334 B
- search-select.html2 KB
- select-field.html500 B
- textarea.html521 B
- toggle-switch.html1 KB
- validation-states.html2 KB
integrations/5 files8 KB
- api-usage.html2 KB
- connection-status.html1 KB
- integration-card.html835 B
- oauth-scopes.html2 KB
- webhook-row.html1 KB
navigation/9 files25 KB
- breadcrumbs.html1 KB
- command-search.html3 KB
- mobile-nav.html3 KB
- sidebar-collapsed.html4 KB
- sidebar.html6 KB
- tabs-pill.html835 B
- tabs-underline.html2 KB
- topbar.html2 KB
- user-menu.html3 KB
onboarding/5 files9 KB
- invite-teammates.html3 KB
- onboarding-checklist.html2 KB
- setup-progress.html1 KB
- tour-popover.html2 KB
- welcome-banner.html1 KB
overlays/10 files16 KB
- announcement-bar.html800 B
- audit-row.html1 KB
- command-palette.html3 KB
- empty-inbox.html664 B
- export-card.html1 KB
- feature-flag-row.html759 B
- feedback-widget.html3 KB
- file-row.html3 KB
- notification-center.html1 KB
- search-results.html2 KB
pagination/3 files4 KB
- pagination-load-more.html695 B
- pagination-numbered.html3 KB
- pagination-simple.html1 KB
pricing/4 files6 KB
- plan-compare.html2 KB
- pricing-card-plain.html2 KB
- pricing-card.html2 KB
- pricing-toggle.html525 B
projects/8 files12 KB
- gantt-bars.html2 KB
- issue-header.html1 KB
- kanban-column.html3 KB
- label-picker.html1 KB
- priority-icons.html2 KB
- roadmap-lane.html2 KB
- sprint-card.html741 B
- task-row.html2 KB
settings/6 files9 KB
- api-key-row.html1 KB
- danger-zone.html650 B
- notification-matrix.html2 KB
- settings-section.html1 KB
- team-invite.html2 KB
- theme-switch.html2 KB
stat-cards/5 files4 KB
- stat-basic.html310 B
- stat-icon-split.html921 B
- stat-progress.html620 B
- stat-sparkline.html1 KB
- stat-trend.html807 B
support/6 files9 KB
- chat-bubbles.html511 B
- reply-composer.html4 KB
- saved-replies.html871 B
- sla-timer.html750 B
- ticket-properties.html2 KB
- ticket-row.html2 KB
tables/5 files22 KB
- table-avatars.html8 KB
- table-basic.html4 KB
- table-compact.html1 KB
- table-selectable.html4 KB
- table-sortable.html5 KB
css/6 files107 KB
fonts/3 files57 KB
- geist-latin-wght-normal.woff229 KB
- geist-mono-latin-wght-normal.woff223 KB
- OFL.txt4 KB
- app.css44 KB
- input.css4 KB
- tokens.css2 KB
docs/1 file19 KB
- tokens.html19 KB
frames/180 files52 MB
components/50 files5 MB
- analytics-dark.png120 KB
- analytics-light.png119 KB
- auth-dark.png68 KB
- auth-light.png68 KB
- badges-dark.png32 KB
- badges-light.png32 KB
- billing-dark.png59 KB
- billing-light.png60 KB
- buttons-dark.png32 KB
- buttons-light.png32 KB
- charts-dark.png303 KB
- charts-light.png294 KB
+ 38 more files
- collaboration-dark.png120 KB
- collaboration-light.png123 KB
- commerce-dark.png102 KB
- commerce-light.png104 KB
- data-display-dark.png154 KB
- data-display-light.png155 KB
- docs-dark.png69 KB
- docs-light.png70 KB
- empty-states-dark.png52 KB
- empty-states-light.png53 KB
- feedback-dark.png146 KB
- feedback-light.png153 KB
- filters-dark.png34 KB
- filters-light.png34 KB
- forms-dark.png186 KB
- forms-light.png188 KB
- integrations-dark.png83 KB
- integrations-light.png82 KB
- navigation-dark.png100 KB
- navigation-light.png103 KB
- onboarding-dark.png111 KB
- onboarding-light.png112 KB
- overlays-dark.png156 KB
- overlays-light.png165 KB
- pagination-dark.png25 KB
- pagination-light.png25 KB
- pricing-dark.png72 KB
- pricing-light.png73 KB
- projects-dark.png105 KB
- projects-light.png109 KB
- settings-dark.png75 KB
- settings-light.png76 KB
- stat-cards-dark.png54 KB
- stat-cards-light.png55 KB
- support-dark.png87 KB
- support-light.png88 KB
- tables-dark.png161 KB
- tables-light.png161 KB
screens/40 files4.7 MB
- analytics-dark.png129 KB
- analytics-light.png130 KB
- billing-dark.png125 KB
- billing-light.png127 KB
- board-dark.png121 KB
- board-light.png121 KB
- contact-detail-dark.png128 KB
- contact-detail-light.png131 KB
- contacts-dark.png117 KB
- contacts-light.png117 KB
- conversation-dark.png150 KB
- conversation-light.png151 KB
+ 28 more files
- developers-dark.png124 KB
- developers-light.png126 KB
- home-dark.png163 KB
- home-light.png163 KB
- inbox-dark.png138 KB
- inbox-light.png139 KB
- integrations-dark.png93 KB
- integrations-light.png93 KB
- knowledge-base-dark.png113 KB
- knowledge-base-light.png114 KB
- onboarding-dark.png111 KB
- onboarding-light.png112 KB
- plans-dark.png117 KB
- plans-light.png119 KB
- reports-dark.png113 KB
- reports-light.png114 KB
- roadmap-dark.png92 KB
- roadmap-light.png94 KB
- settings-profile-dark.png101 KB
- settings-profile-light.png101 KB
- settings-workspace-dark.png106 KB
- settings-workspace-light.png106 KB
- sign-in-dark.png65 KB
- sign-in-light.png64 KB
- task-list-dark.png102 KB
- task-list-light.png105 KB
- team-dark.png117 KB
- team-light.png118 KB
svg/90 files42 MB
components/50 files20 MB
- analytics-dark.svg10 KB
- analytics-light.svg10 KB
- auth-dark.svg243 KB
- auth-light.svg307 KB
- badges-dark.svg147 KB
- badges-light.svg146 KB
- billing-dark.svg217 KB
- billing-light.svg259 KB
- buttons-dark.svg159 KB
- buttons-light.svg158 KB
- charts-dark.svg8 KB
- charts-light.svg8 KB
+ 38 more files
- collaboration-dark.svg406 KB
- collaboration-light.svg452 KB
- commerce-dark.svg639 KB
- commerce-light.svg775 KB
- data-display-dark.svg453 KB
- data-display-light.svg604 KB
- docs-dark.svg282 KB
- docs-light.svg313 KB
- empty-states-dark.svg164 KB
- empty-states-light.svg209 KB
- feedback-dark.svg454 KB
- feedback-light.svg553 KB
- filters-dark.svg185 KB
- filters-light.svg197 KB
- forms-dark.svg825 KB
- forms-light.svg904 KB
- integrations-dark.svg13 KB
- integrations-light.svg13 KB
- navigation-dark.svg416 KB
- navigation-light.svg580 KB
- onboarding-dark.svg580 KB
- onboarding-light.svg624 KB
- overlays-dark.svg798 KB
- overlays-light.svg928 KB
- pagination-dark.svg101 KB
- pagination-light.svg101 KB
- pricing-dark.svg374 KB
- pricing-light.svg430 KB
- projects-dark.svg357 KB
- projects-light.svg537 KB
- settings-dark.svg413 KB
- settings-light.svg473 KB
- stat-cards-dark.svg159 KB
- stat-cards-light.svg231 KB
- support-dark.svg285 KB
- support-light.svg360 KB
- tables-dark.svg1.7 MB
- tables-light.svg1.8 MB
screens/40 files22 MB
- analytics-dark.svg687 KB
- analytics-light.svg797 KB
- billing-dark.svg453 KB
- billing-light.svg531 KB
- board-dark.svg482 KB
- board-light.svg622 KB
- contact-detail-dark.svg417 KB
- contact-detail-light.svg496 KB
- contacts-dark.svg1 MB
- contacts-light.svg1.1 MB
- conversation-dark.svg484 KB
- conversation-light.svg590 KB
+ 28 more files
- developers-dark.svg200 KB
- developers-light.svg207 KB
- home-dark.svg528 KB
- home-light.svg661 KB
- inbox-dark.svg1 MB
- inbox-light.svg1.1 MB
- integrations-dark.svg392 KB
- integrations-light.svg486 KB
- knowledge-base-dark.svg429 KB
- knowledge-base-light.svg533 KB
- onboarding-dark.svg607 KB
- onboarding-light.svg659 KB
- plans-dark.svg555 KB
- plans-light.svg624 KB
- reports-dark.svg538 KB
- reports-light.svg634 KB
- roadmap-dark.svg368 KB
- roadmap-light.svg446 KB
- settings-profile-dark.svg468 KB
- settings-profile-light.svg519 KB
- settings-workspace-dark.svg443 KB
- settings-workspace-light.svg477 KB
- sign-in-dark.svg186 KB
- sign-in-light.svg202 KB
- task-list-dark.svg350 KB
- task-list-light.svg397 KB
- team-dark.svg489 KB
- team-light.svg537 KB
js/1 file3 KB
- ui.js3 KB
screens/20 files404 KB
- analytics.html23 KB
- billing.html22 KB
- board.html25 KB
- contact-detail.html22 KB
- contacts.html26 KB
- conversation.html28 KB
- developers.html21 KB
- home.html25 KB
- inbox.html23 KB
- integrations.html19 KB
- knowledge-base.html19 KB
- onboarding.html11 KB
+ 8 more files
- plans.html20 KB
- reports.html20 KB
- roadmap.html17 KB
- settings-profile.html19 KB
- settings-workspace.html18 KB
- sign-in.html4 KB
- task-list.html19 KB
- team.html23 KB
- index.html826 KB
- LICENSE.txt172 B
- README.md4 KB
- THIRD-PARTY-NOTICES.txt2 KB
css/geist-latin-wght-normal.woff2geist-mono-latin-wght-normal.woff2OFL.txtapp.cssinput.csstokens.css
frames/analytics-dark.pnganalytics-light.pngauth-dark.pngauth-light.pngbadges-dark.pngbadges-light.png
Built for
HTML and Tailwind CSS v4, current Chrome, Safari, Firefox and Edge. The SVG frames drag into Figma, Sketch or Illustrator.
Not a .fig file. UI kits are HTML/Tailwind code plus SVG frames you can import into Figma.
What you need
A browser. The compiled CSS is included. The Tailwind source and tokens.css are in the ZIP if you want to rebuild.
Not in the ZIP
- Backend, auth or billing logic
- A .fig file
- A React or Vue port
- Editable text in the SVG frames (text there is outlined)
Fonts and notices
- Geist licence: SIL OFL 1.1 · github.com/vercel/geist-font
- Geist Mono licence: SIL OFL 1.1 · github.com/vercel/geist-font
- Tailwind CSS (compiled output) licence: MIT · tailwindcss.com
Third-party parts keep their own licences: Tailwind CSS (compiled output) (MIT).
Which licence do you need?
Making money for someone else with it? Commercial. Selling a product that others pay to use? Extended. Just for you? Personal.
| Personal$89 | Commercial$179 | Extended$449 | |
|---|---|---|---|
| In plain words | A practice dashboard or a portfolio piece. Nothing earns money. | A client's admin panel, or your own free internal tool. | The interface of a paid SaaS or app that your customers pay to use. |
| Who can use it | One person | Up to 5 team members | Up to 25 team members |
| Personal projects | Yes | Yes | Yes |
| Client projects | No | Yes, unlimited | Yes, unlimited |
| Free end products | No | Yes | Yes |
| Products where users pay | No | No | Yes |
| Credit required | None | None | None |
None of the licences let you resell or share the files, upload them to a marketplace, or use them to train AI models. Compare licences in full. The full legal text is on the licence page.
Updates
This is version 1.0.0. If we post a fix, the new ZIP replaces the old one and the changelog below says what changed. You can get fresh links for an order any time from the resend page. Get new download links
Also in Complete Lab
See the bundle pageBundle: $249 (items bought separately: $316)
Bundle: $499 (items bought separately: $636)
Bundle: $1,249 (items bought separately: $1,596)
Goes well with
PAL-TP-03 · Template · Large
SaaS Marketing Suite
The marketing site for a software product, all 16 pages of it.
$99Personal
Commercial $199 · Extended $499
PAL-IC-03 · Illustrations · Large
Scenes 40
Illustrations for the screens nobody designs: empty inbox, 404, success, onboarding.
$59Personal
Commercial $119 · Extended $299
PAL-MK-03 · Deck · Large
Presentation System
A slide library for people who make a lot of decks.
$69Personal
Commercial $139 · Extended $349
Questions
What do the tokens control?
Colour, status colour, type scale, spacing, radius and shadow, in light and dark, in one CSS file. The docs page in the ZIP lists them all.
If I ship this inside a paid SaaS, which licence?
Extended. Your customers pay to use what the files are built into.
Refund and delivery. Instant download after payment. Links also arrive by email. Digital files can't be returned. If something's broken or missing, we fix it or refund you. Refund policy