beUI Pro

Feature Sections

Premium feature blocks: a three-column gradient-card showcase, a list synced to a live visual, a numbered three-step flow, an asymmetric bento grid, a compact tabbed showcase, and a full-width product stage.

Feature showcase

features-showcase.tsx

A split header over three gradient-stage cards, each framing a product screenshot with a title and description below.

System explanation

One library.Every layer covered.

beUI gives you the motion, polish, and structure to ship premium interfaces faster — without rebuilding the basics.

Add a pricing block and a hero to my landing.
Pricing — plans grid
Hero — code demo
Footer — spotlight
CTA — gradient FAQ

Four blocks added

Done — your landing page is assembled.
pricing.tsxhero.tsxfooter.tsx

Assemble a page in minutes

Drop in premium blocks — pricing, hero, footer, CTA — and a full landing page comes together fast.

pricing.tsx
hero-code-demo.tsx
footer-spotlight.tsx
agent-chat-input.tsx
cta-faq.tsx
features-tabs.tsx
pricing.tsx
hero-code-demo.tsx
footer-spotlight.tsx
agent-chat-input.tsx
cta-faq.tsx
features-tabs.tsx

Source files, fully yours

Every component ships as real source you can read, edit, and own — no black-box dependency.

$ npx shadcn add

@beui-pro/pricing
added pricing

Install in one command

Add any premium component straight from your private registry with the shadcn CLI.

Install

$ bunx --bun shadcn add @beui-pro/features-showcase

Feature list

features-list.tsx

A left-aligned feature list where the active item brightens and drives a synced animated visual on the right.

Everything you need to shippremium UI, nothing in your way.

From primitive to shipped block in minutes — polished, animated, and ready to publish.

pricing.tsx Copied

Install

$ bunx --bun shadcn add @beui-pro/features-list

Feature steps

features-steps.tsx

A centered header over a numbered three-step flow: the active step expands and drives a synced visual mock.

Simple by design

From idea to shipped UI in three steps

Turn a single prompt into a finished interface — compose premium blocks and own the source, all from one workflow.

Build a pricing page with a hero and a gradient CTA for my SaaS.

GenerateCompose

Install

$ bunx --bun shadcn add @beui-pro/features-steps

Feature bento

features-bento.tsx

An asymmetric bento grid of agent-platform features over animated Grainient WebGL backdrops, each cell with its own self-contained looping animation — a scripted agent conversation, a tool-connect terminal, a scrolling memory recall, a structured-output builder, and a human-in-the-loop approval gate. Backdrops and loops pause when off-screen.

Why agents

Everything your agent needs,wired up out of the box.

Tools, memory, streaming, and tracing — ship a production agent without stitching the plumbing together yourself.

Find recent AI papers and email me a summary.
Working
web_search
read_page
send_email
Sent 5 papers to your inbox — summary included.

Watch the agent reason

It plans, calls the right tools, and reports back — the full loop, streamed step by step.

$ agent tools add

connectedweb-search
connectedcode-runner
connectedpostgres

Add a tool in one line

Plug in any MCP server or function — the agent discovers and calls it automatically.

Prefers concise answers
Stack: Postgres + Vercel
Timezone GMT+5:30

Remembers what matters

Long-term memory and retrieval, baked in across runs.

output.json schema

{

"intent": "summarize",

"sources": 5,

"confidence": 0.94

}

Returns structured output

Schema-valid, typed JSON every time — ready to use downstream.

Approval needed

deploy → production?

Pauses for approval

Asks before risky actions — approve or edit each step.

Install

$ bunx --bun shadcn add @beui-pro/features-bento

Feature tabs

features-tabs.tsx

An interactive feature showcase: a shared-layout tab list drives an animated preview panel with a framed screenshot for each feature.

How it fits together

One library,every layer.

Interaction primitives that feel alive

Buttons, inputs, tabs, and toggles with tuned press, hover, and focus motion — the building blocks of a polished UI.

  • Spring press feedback
  • Shared-layout toggles
  • Focus states

Install

$ bunx --bun shadcn add @beui-pro/features-tabs

Feature stage tabs

features-stage-tabs.tsx

Four large horizontal tabs drive a shared product stage with coded workspace, automation, insights, and learning scenes, responsive snap scrolling, autoplay, and keyboard navigation.

Every conversation stays in context

Bring requests, customer history, and team decisions into one calm workspace.

Relay workspace

Aria Flores

Product workspace

Assign
Can you help us move the design team onto the annual workspace?
Absolutely. I’ve prepared the workspace change and kept your current permissions intact.
Write a reply

Install

$ bunx --bun shadcn add @beui-pro/features-stage-tabs