Once UI

Build consistent React interfaces with reusable components, styles, and design resources

Meet Once UI

Once UI is a design system and collection of interface tools for building websites and applications. Its core package provides React components and styles tuned for Next.js, with customization options that let teams change the visual treatment while retaining a consistent component foundation. The library includes data visualization support through Recharts.

The wider collection offers blocks, starter projects, portfolio and documentation templates, and a Figma resource for design work. Developers can use the MIT-licensed core through npm and consult the documentation as they assemble an interface. Once UI is useful for designers and developers who want shared visual conventions across prototypes and implemented products.

Discussion

Tried it? Share a useful thought or ask a question.

Product details

Website: once-ui.com
Status: Launched
Category: Design & creative
Listed: Oct 17, 2026

Explore related topics

Design systems Nextjs Open source React UI components

Embed upvote button

Let visitors support Once UI from your website.

Button appearanceLightDark

Once UI

Upvote

Paste into your site’s HTML

<div data-betaneon-widget="light" style="box-sizing:border-box;display:flex;align-items:center;gap:12px;width:320px;max-width:100%;min-height:84px;padding:12px 14px;margin:0;border:1px solid #e1e0dc;border-radius:12px;background:#ffffff;color:#181818;font:400 14px/1.4 Arial,Helvetica,sans-serif;text-align:left;">
  <img src="https://m.betaneon.com/ic/cfb9d2cb-9287-435d-bc07-19b5e77b2aa7.webp" alt="" width="36" height="36" referrerpolicy="no-referrer" style="box-sizing:border-box;display:block;flex:0 0 36px;width:36px;height:36px;margin:0;padding:0;border:0;border-radius:9px;object-fit:contain;background:#fff;">
  <div style="box-sizing:border-box;flex:1;min-width:0;margin:0;padding:0;">
    <span title="Once UI" style="display:block;margin:0;padding:0;color:#181818;font:700 16px/1.4 Arial,Helvetica,sans-serif;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">Once UI</span>
    <div style="display:flex;align-items:baseline;gap:4px;margin:4px 0 0;padding:0;white-space:nowrap;">
      <span style="margin:0;padding:0;transform:translateY(-1.5px);color:#626664;font:400 14px/1.2 Arial,Helvetica,sans-serif;">on</span>
      <a href="https://betaneon.com/" target="_blank" rel="noopener noreferrer" aria-label="BetaNeon home (opens a new tab)" style="display:inline-flex;flex-shrink:0;margin:0;padding:0;border:0;background:transparent;text-decoration:none;outline-offset:3px;"><img src="https://betaneon.com/res/brand/wordmark.svg?v=453516e27973dc87" alt="BetaNeon" width="87" height="16" referrerpolicy="no-referrer" style="display:block;width:87px;height:auto;margin:0;padding:0;border:0;"></a>
    </div>
  </div>
  <a href="https://betaneon.com/vote/once-ui" target="_blank" rel="noopener noreferrer" aria-label="Upvote Once UI on BetaNeon (opens a new tab)" style="box-sizing:border-box;display:flex;flex:0 0 68px;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:56px;margin:0;padding:0 0 0 12px;border:0;border-left:1px solid #e1e0dc;background:transparent;color:#087f5b;font:400 14px/1.2 Arial,Helvetica,sans-serif;text-decoration:none;text-align:center;outline-offset:3px;">
    <span aria-hidden="true" style="box-sizing:border-box;display:block;width:9px;height:9px;margin:3px 0 0;padding:0;border:0;border-top:2px solid #087f5b;border-left:2px solid #087f5b;transform:rotate(45deg);"></span>
    <img src="https://betaneon.com/embed/upvote/once-ui/count.svg?theme=light" alt="Votes" width="56" height="20" referrerpolicy="no-referrer" style="display:block;width:56px;height:20px;margin:0;padding:0;border:0;">
    <span style="color:#087f5b;font:400 14px/1.2 Arial,Helvetica,sans-serif;">Upvote</span>
  </a>
</div>

Links open in a new tab. Visitors sign in on BetaNeon, then confirm their upvote. The vote count updates when the page loads.

Unclaimed

Building Once UI?

Claim this profile to keep your product’s story up to date.

Sign in with your verified work email. Matching website domains are approved automatically; other requests are reviewed by our team.

Meet Once UI

Discussion

Product details

Explore related topics

Similar products

Tailkits UI

Tailgrids

Storybook

SHIUI

Balsa UI

Taste Lab