Free shadcn components and apps, ready to ship

React + Tailwind components and complete apps, previewed live and checked before release: components install with one command, templates download whole. And lessons from real builds, searchable by an error’s text, that your AI assistant reads through UpFork’s MCP.

npx shadcn@latest add https://upfork.dev/r/shadcn-event-calendar-scheduler-react.json
Meridian — Finance Dashboard Template for Next.js & shadcn/ui (Cash Flow, Live Investments, Invoicing)·Landing page by UpFork

Details

Kind
Landing page
License
MIT
Price
Free
Version
1.0.0
Tags
fintech · finance-dashboard · admin-dashboard
Updated
30 Oct 2026

An enterprise finance dashboard for Next.js and shadcn/ui: cash flow, net worth, transactions, budgets, accounts and cards, five investment pages with live prices, insurance, loans with a prepayment simulator and a full invoicing suite. 22 screens in light and dark.

Lessons

The error you just hit, already solved

Docs say how a package should behave; the surprises come while you build. Every lesson here was learned building a real product you can open: what was assumed, what happened, with the error’s exact text, why, and the fix, checked on that product. Paste an error to find it, or let your AI assistant search the same lessons through UpFork’s MCP.

My own mistakeL-GWV0Developer

A price tag on every item of a dense rail is noise: show the one in front, and any other only while it is pointed at

What happened
the developer, on seeing it, said no label needs to show on every piece: show a garment's price when the mouse comes over it. A ladder of fourteen prices drew the eye away from the garments, and its layout (columns per piece and per screen…
Rule
If a rail or carousel with bunched items shows a label on every item, show only the front item's label at rest, and another item's only while a mouse or a resting finger is on it.

Turnrail — Fashion Shop Product Carousel & Detail Sheet for React Native and Expo · Ramin Valadan ·

My own mistakeL-3MTCAI

Free photo libraries hold clothes on rails, not product shots of one garment: plan on images made for the product

What happened
of about 290 large free photographs, most showing clothes, nearly all were rails seen edge on, shop interiors, museum pieces on stands, or empty hangers.
Rule
If a product needs several views of one garment under one light (front, back, worn, close-up), free libraries won't have it: plan on images made for the product.

Hangline — 3D Clothing Store Product Carousel for React, with Sizes, Bag & Accessory Tray · Ramin Valadan ·

Featured

Whole apps, templates and components, picked by hand from everything on UpFork. Open one to see it run, then take it into your project.

Browse everything

Mobile

React Native, tried in a phone

Components for Expo apps, built with Reanimated, Gesture Handler and Skia. Each runs live in a phone on its page, and goes into your app as code, checked first in a fresh Expo app on SDK 57.

Live previews and install checks

See it run, then install what was checked

Screenshots flatter, and a README's install line can fail in a clean project. Here every product runs live on its page, and no component reaches you before it has installed and type-checked in a fresh project.

  1. 01

    Preview it live

    Components and pages run in a sandboxed preview on an origin of their own: light or dark, at phone, tablet or desktop width, with the code one tab away.

  2. 02

    Checked before it reaches you

    The shadcn CLI installs every revision of a component into a fresh Next.js project, which then type-checks. Its code and npm packages are scanned, and an admin approves that exact revision.

  3. 03

    Install it in one command

    The shadcn CLI drops a component and its dependencies into your project, with no account for the free ones. Everything else downloads with a checksum.

MCP

Your AI assistant searches, reads and installs

An assistant that guesses at a package spends its turns on errors someone already solved. Connected to UpFork’s MCP server, it searches the lessons and the catalog itself, reads a product’s code, and installs it into your project. Searching, reading and installing free products need no account.

claude mcp add --transport http upfork https://upfork.dev/mcp --scope user

That’s Claude Code; Claude, Cursor, VS Code and others take the same address. Listed in the official MCP Registry as dev.upfork/upfork.

upfork.dev/mcp

Finds
  • search_lessonsAn error's text in, the lessons that fix it out
  • search_productsThe catalog, from what you describe
Reads
  • get_lessonOne lesson whole: what happened, why, the fix
  • view_productA product, its license and its install command
  • read_product_fileOne file of its code, its lines numbered
Acts
  • install_productThe shadcn command, packages, styles and file list
  • confirm_lessonSays, in your name, that a lesson held

Profiles and résumés

A résumé anyone can check

A portfolio and a CV are claims nobody can check. Every developer on UpFork has a public page where their products run live and the installs are real numbers. It prints as a PDF résumé with a number and a QR code of its own, and whoever scans it sees what UpFork checked, kept apart from what the developer says about themselves.

Articles

How it was built, by who built it

Developers write about the products they made: how each one works, what was hard and how they solved it. The product is alive in the text: its real files at the lines that matter, its live preview and its install command, so you learn from the code you can take.

Behind the build

Behind the build · Turnrail — Fashion Shop Product Carousel & Detail Sheet for React Native and Expo

Swing tags and a flight off the hook in React Native: outline hit-tests, shared elements, web traps

How Turnrail shows a price only where you point, by each picture's outline, flies a garment off its hook into a sheet and into the bag drawn once in every frame, and what React Native Web hides.

Ramin ValadanProved GitHub account and website, confirmed e-mail: checked by UpFork28 min readAI

20 lessons

Behind the build

Behind the build · Turnrail — Fashion Shop Product Carousel & Detail Sheet for React Native and Expo

A garment rail in React Native where each piece turns on its hook: perspective, bunching, swing

How Turnrail turns a garment from its front photo to its side photo in perspective, bunches the rail's ends, swings each piece as a pendulum and keeps a drag at 1:1, with Reanimated on the web too.

Ramin ValadanProved GitHub account and website, confirmed e-mail: checked by UpFork32 min readAI

18 lessons

For developers

Sell your work, paid to your own wallet

Publish components, templates, full-stack projects and mobile components from one panel, and get paid in USDT to your own wallet. UpFork's share is 20%, taken as whole sales: the 5th, 10th, 15th… sale of each product is paid to UpFork's wallet, and every other sale straight to yours, in full, starting with the first four.

  • Paid to your own wallet
  • UpFork's share: 20%, from each product's 5th sale
  • A public page and a checkable PDF résumé
  • Reviews, bugs and tickets in one desk
  • Approved developers only
Apply to sell

By design

Built so you can check it

Lessons you can read with no account, trust that takes other people's confirmation, code you install with one command, and a developer's money that UpFork never holds.

0
Accounts needed to read a lesson or install a free component.
2
Other accounts must confirm a lesson before it reads as Confirmed.
1
Command installs a component and its dependencies.
0 USDT
Held by UpFork: a paid sale goes wallet to wallet.
  • Component authors

    Publish through UpFork's shadcn registry; anyone installs with one command.

  • Template makers

    Whole landing pages, previewed live at every screen width.

  • Full-stack developers

    Versioned releases, scanned and checksummed.

  • Mobile developers

    React Native components that go straight into an Expo app.

Accounts

Start with no account, join when you need to

Lessons, live previews and free components need no account. A free account adds ZIPs, AI prompts and your assistant working in your name. Get approved as a developer to publish your own. Joining costs nothing.

Show one way in

Guest

FreeNo account

Lessons, live previews and free installs

Search the lessons

Member

FreeA free account

ZIPs, AI prompts, your assistant in your name

Create an account

Developer

FreeApproved by UpFork

UpFork's share is 20%, on paid sales only

Apply as a developer

Lessons

What builders learned, checked on real products

Search and read every lesson
Preflight for your project
Say whether a lesson worked
Your team's private lessons
Like, rate and comment on articles

Your AI assistant

Connected through UpFork's MCP server

Lessons, search and free installs
Your account, tickets and paid installs
Your articles and lesson drafts

Getting products

UpFork's own products are all free

Browse and try live previews
Open demos in a tab of their own
Free products
Likes and bookmarks
Buy paid products in USDT (TRC-20)

Installing

Getting the code into your project

Free components with the shadcn CLI
Paid components with the CLI
ZIPs and release downloads
A prompt for AI coding tools

Publishing

Your own work, free or paid

Publish products
Write articles and lessons
AI summaries drafted from your code
UpFork's share of paid sales
—
—
20%
Your own TRC-20 wallet
Sales, transfers and claims
A public developer profile
A PDF résumé anyone can check
Answer reviews, bugs and tickets

After you take it

Reviews, updates and help

Review a product, report a bug
Watch products, hear about updates
Support tickets
Sign-in help

Safety

What protects everyone

Sandboxed live previews
Code checked before it reaches you
Scanned files with a SHA-256
Two-step sign-in
Sign out everywhere on a new password

FAQ

Questions, answered

How lessons and AI assistants, products, selling and help work. Still stuck? Open a support ticket, or read the docs.

Lessons and AI assistants

A lesson is a short record of something that surprised a builder and was checked on a real product: a rule (if you see this, do that), a snippet, a check that proves the fix, and the packages and versions it holds for. Your assistant learned from older code and can't see what a library changed since, so it repeats traps other builders already solved. Reading the lessons for your packages first lets it start from their fix. Search them by error text or package at upfork.dev/lessons, or through MCP.

Add the address https://upfork.dev/mcp to your assistant; it needs no token and no account. In Claude Code, run: claude mcp add --transport http upfork https://upfork.dev/mcp --scope user. In Cursor, put {"mcpServers":{"upfork":{"url":"https://upfork.dev/mcp"}}} in ~/.cursor/mcp.json; in VS Code, put {"servers":{"upfork":{"type":"http","url":"https://upfork.dev/mcp"}}} in .vscode/mcp.json. In Claude on the web or desktop, add it as a custom connector; upfork.dev/docs/mcp has one-click links for Cursor and VS Code too.

Preflight is the tool that gives your assistant the few lessons (up to 10) that apply to your project, short, before it writes any code. It runs once at the start of work, with a sentence about the task and your package.json's dependencies, and again after installing packages, when the versions decide which lessons fit. In an empty folder the sentence alone is enough. In UpFork's own tests, models given the server alone seldom used it, so add UpFork's short block to your project's AGENTS.md or CLAUDE.md (upfork.dev/docs/templates): with it, 10 of 12 test runs called UpFork, nearly always preflight first.

It helped clearly in one case of a small test, and it saved no tokens. In UpFork's own Bench (24 runs on 2026-10-28: three tasks, two free models, two runs each), the model that found and installed UpFork's calendar built a working one both times, scoring 5 and 6 out of 6, against 3 and 2 without UpFork. In the other five cases the scores stayed within a point of each other. Total tokens were about the same (+2.9%), so no saving is claimed, and two runs a case is little: read it as a first signal, not proof.

Only what your assistant puts into a call: UpFork can't read your files. Preflight sends a sentence about the task (500 characters at most) and your package.json's package names and versions; it is used to answer and isn't stored. A search sends its words, and UpFork keeps them (up to 200 characters) with the time, the number of results and your account if you're signed in, for 180 days, never your IP address. A separate log keeps which tool ran, when and whether it worked, but none of what was sent.

No: without an account your assistant gets eight tools (preflight, search_lessons, get_lesson, search_products, view_product, read_product_file, install_product for free products, and sign_in). Signing in adds what is done in your name: saying a lesson worked or didn't, installing products you bought, copying a product's AI prompt, support tickets, your profile and résumé, your teams' private lessons, and for developers, articles and lesson drafts. Your assistant calls sign_in when it first needs your account: your browser opens UpFork, and you choose what to allow. No app can buy anything or see your password.

Each lesson shows how far to trust it: published (its developer approved it and it passed UpFork's automatic checks), confirmed (agents of two or more other accounts applied it and it held), doubtful (two or more accounts disputed it, at least as many as confirmed it) or outdated (a package it names has moved past the version it was written for). Every new lesson needs a check that proves its fix and the versions it holds for, and every day UpFork compares those packages with npm. Each version of a lesson, and each agent's word on it, is signed into a public ledger that can't be changed unnoticed: check one at upfork.dev/verify. Lessons are still reports of what happened to someone, not guarantees, so test what you apply.

Yes, if you're an approved developer; any member's assistant can also confirm or dispute a lesson after applying it. An assistant building your product records a lesson the moment a fix is solved and checked, as a private draft (ten a day), and you publish, edit or drop it in your developer panel; software checks it, and no one at UpFork reads it first. Lessons also come with articles: every article carries at least one, and a new writer's first two articles are read by UpFork before they go out. An article's lessons get notes from UpFork's pre-check, its own rules and, when it's switched on, Claude: a vague rule, a missing check, a package the product doesn't use, a lesson that repeats one already published. They're suggestions for you, beside each lesson in the editor, never a block. Once published, a lesson has its own number and page.

Yes: a team is a private space, free for now, where your assistants record lessons about your own code and infrastructure. Make one under Teams in your account, invite members by e-mail or link, and have each member connect UpFork and allow "Your teams' private lessons". Their assistants then get the team's lessons beside the public ones in preflight and search, and nobody else sees them: they are not in public search, the sitemap, llms.txt or the ledger, and a member's lesson searches aren't logged. A team has one owner, who publishes its lessons, and up to 20 members.

Yes: lessons and the MCP server are free now, and so is everything UpFork makes. UpFork may limit or charge for the lessons and the MCP server later, and will announce it at least 30 days before. UpFork's own products are MIT-licensed and free, and a charge for lessons never changes that. The only paid things are some developers' products, paid in USDT straight to the developer.

Whoever wrote a lesson keeps it, and gives UpFork a lasting license to publish it and license it to others. You may use a lesson and its snippet freely in your own projects. Copying lessons in bulk, building a dataset or training an AI model on them needs UpFork's written permission; lessons are not under an open license. Each lesson is credited to its author's name or handle, or to their team.

No. A published lesson or article is never deleted on UpFork, not by its author and not by UpFork, which can only hide one. An author can take an article off the site (the editor's "Take it off the site", or hide_article in MCP) and put it back later; its lessons are kept, but stay off the site while the article is off. Only an article that was never published can be deleted. When an account is closed, its lessons and articles stay as "a former member".

Products

All of UpFork's own products are free and MIT-licensed: use them, change them, ship them. A developer's product shows its own license on its page: the UpFork Standard License (any number of personal and commercial projects, but not resold or shared on its own) or an open license such as Apache 2.0, BSD 3-Clause or GPL v3. Some developers' products are paid, in USDT, and show their price and license before you buy.

With the shadcn CLI. A free one installs by its address, with no account or setup: npx shadcn@latest add https://upfork.dev/r/<name>.json. A paid one you bought installs as @upfork/<name>, with the personal token you create on your account page set as UPFORK_TOKEN, and each product page shows its own command. Your assistant can install components and landing pages for you through MCP; full-stack projects and plain-HTML landing pages are downloaded instead.

Yes. Every component and landing page runs live on its page, in light and dark, at phone, tablet and desktop width, and mobile components run in a phone. You need no account to try them or to read the code of free products. Paid code lists its files up front and unlocks when you buy.

It is checked, but no check catches everything, so read what you install. Before a developer's code goes on sale, and again on every change, UpFork installs it in a fresh project, scans it for the sites it talks to, hidden code and what it reads, checks its npm packages for install scripts and known malware, and approves that exact revision; the packages are then watched daily. Live previews run sandboxed on an origin of their own, so they can't reach the site or your account. Report a product that looks harmful from its page.

Buying takes a free account, and you pay in USDT on the TRON network (TRC-20) only: your order shows the price and the address, and you paste the transfer's transaction ID on the order. UpFork checks it on-chain, and the product unlocks once the full price is confirmed, usually a minute or two after you send it; paying less is fine, since what you sent counts and you send the rest the same way. Sales are final: UpFork can't refund an overpayment, and USDT sent on another network (ERC-20, BEP-20) or to another address is lost, because the money goes straight to the developer's own wallet, or UpFork's on the sales that are its share (the 5th, 10th, 15th… sale of each product), and UpFork never holds it.

Developers

Apply on the Sell page: prove your GitHub account or your website is yours (a code in a gist, or a small text file on your site), add a résumé if you like, and UpFork reviews your work, usually within a few days. Applying, publishing and the developer panel are free. UpFork's share is 20%, taken as whole sales: the 5th, 10th, 15th… sale of each product is paid to UpFork's wallet, and every other sale straight to yours, in full, starting with the first four. Up to 20 founding developers pay no share for their first 12 months (upfork.dev/sell/founders), and every developer gets a public page that prints as a PDF résumé anyone can check at upfork.dev/verify.

It's the short Markdown an AI assistant connected to UpFork reads first, instead of all of a product's files: what it is, the install line, the entry point, the key props, one example and the files to read next. You write it in the product's Details, or, unless you turn it off for that product, Claude drafts one from your code (when the product has none, when its summary no longer matches the code, or when you press Suggest again) and you accept, edit or discard it. A draft left undecided goes live after 7 days, marked as written by AI and not yet reviewed, if it still matches the code. UpFork reads every summary against the code, with no AI, and sets aside one that no longer matches, so an assistant is never pointed at a file that isn't there. Drafting sends the product's code to Anthropic, which may not train its models on it (upfork.dev/privacy).

Help

Open a ticket on the support page, from your order or from the product's page: add screenshots, a PDF or a ZIP, and every answer reaches you on the site and by e-mail. Answers come from UpFork support and may be drafted with AI for UpFork's admins, never sent by themselves: a person at UpFork sends each one, and nothing from your account goes to the AI. If you can't sign in, the support page has a form for that, or write to support@upfork.dev. To report a bug in a product you have, use Reviews and bugs on its page: its title, version and state are public, the steps and screenshots stay between you, its developer and UpFork, and you're told when it's fixed. Members who have a product can also review it there.

Stop rebuilding what’s already built.

Take any of UpFork’s products free, or sell your own work, paid straight to your wallet: UpFork’s turn only comes on each product’s 5th sale.