threeui README

The project's README from github.com/MengTo/threeui. As one markdown file: README.md.

ThreeUI Community

Sponsor ThreeUI: Linked README placements start at $500/month, with website placements from $1,500/month. View sponsorship plans.

The open-source, login-free edition of ThreeUI. It uses the same application shell, layout, navigation, browse grid, search, themes, responsive behavior, component pages, live renderers, controls, variant picker, and source tabs as the main project.

The catalog is the only product-level difference: Pro and Beta components are removed. Every Community component keeps all of its free variants and controls.

Browse ThreeUI · View the source on GitHub

ThreeUI Community preview

Sponsor ThreeUI

Sponsorship keeps the open-source Community library maintained and puts your product in front of ThreeUI's developer audience. Website traffic is currently estimated at roughly 90,000 views per day as of 26 August 2026; this is directional traffic context, not a guarantee of sponsor impressions, clicks, or results.

Plan Price Placement and involvement
Ecosystem Sponsor $500/month Linked banner near the top of the public GitHub README, plus a thank-you credit in this sponsorship section. Up to 6 sponsors.
Featured Sponsor $1,500/month Everything in Ecosystem, plus a small linked banner in the ThreeUI website documentation sidebar. Up to 2 sponsors.
Ultimate Sponsor $3,000/month Both banner placements, one approved fixed-scope integration project per agreement, and priority consideration for maintenance needs, sponsor feedback, and reasonable special requests. All work is mutually agreed in writing.

See the complete sponsorship details or email [email protected]. Sponsorship does not guarantee roadmap changes, editorial control, exclusivity, or private support.

Included

Run locally

npm install
npm run dev

Run the complete publication boundary, type, and production-build checks:

npm run build

Install the React package

Install the public Community component library from npm:

npm install @designcodeio/threeui

Import a component and the shared styles:

import { AtTheHorizon } from "@designcodeio/threeui";
import "@designcodeio/threeui/style.css";

export function Hero() {
  return <AtTheHorizon />;
}

For the smallest development import graph, use a component subpath:

import { AtTheHorizon } from "@designcodeio/threeui/components/AtTheHorizon";

Components that render full HTML documents expect their runtime files at the same root-relative URLs used by the ThreeUI preview. Copy the needed files from node_modules/@designcodeio/threeui/lib-dist/assets/ into your app's public directory, or override the component's sourceUrl or assetBaseUrl prop where available.

Pro source access

Pro implementation source is deliberately not published to npm. Active ThreeUI Pro members authenticate through the browser and download an entitled source bundle with the public CLI:

npx @designcodeio/threeui-cli add cross-beam

The CLI uses OAuth with PKCE, stores its refreshable session with owner-only permissions, checks the account entitlement on every server request, and refuses to overwrite changed project files unless --force is supplied. Run npx @designcodeio/threeui-cli --help for login, logout, destination, and development endpoint options.

Synchronization

The checked-in repository runs independently. Maintainers can refresh its Community subset from a separately held main-project snapshot:

npm run sync:community -- /path/to/main-threeui

The sync fails closed, filters Pro and Beta before generating the public import graph, preserves all free metadata and options, removes restricted font assets, and writes:

The private ThreeUI repository runs this synchronization after every successful push to main. A no-op sync exits without a release. Changes update the automation/community-sync branch and open one reviewed pull request here. New public components, variants, or controls infer a minor release; removals infer a major release; compatible source changes infer a patch release. Merging a versioned sync pull request publishes the new package through npm trusted publishing with provenance.

The public workflow also runs a clean build, boundary audit, package creation, and anonymous installation smoke test before release. The Pro installer is versioned and published separately; changes to Pro component content do not require a CLI release.

License

Application code, Community component code, and ThreeUI-authored Community imagery are MIT licensed. Bundled open fonts remain under the SIL Open Font License 1.1, and bundled Three.js runtime files remain MIT licensed. Remote catalog thumbnails and previews loaded from https://threeui.com are not redistributed by this repository. See ASSET-LICENSES.md, FONT-LICENSES.md, and THIRD_PARTY_NOTICES.md.

threeui (MengTo/threeui)

Searching Database…

6.7K ·GitHub
这是什么?ThreeUI 社区版是开源、免登录的 React 组件目录版本,基于 Three.js/WebGL 和着色器驱动的 UI 组件构建,并附带一个可实时交互浏览的网站。
这是组件库还是完整应用?这是一个通过 npm 发布的 React 组件库,并配有一个演示/目录网站。该网站使用与 ThreeUI 主项目相同的外壳、导航、搜索和实时渲染器,只是去掉了 Pro 和 Beta 组件。
我该怎么把它加到项目里?从 npm 安装公开的社区版组件库,然后导入组件及其共享样式;如果想要依赖关系更精简,也可以使用组件的子路径导入。
使用这些组件,除了 React 还需要什么?该库基于 Three.js 实现 WebGL/着色器渲染。部分需要渲染完整 HTML 文档的组件,还需要把它们的运行时资源文件复制到你应用的 public 目录中。
这里包含 ThreeUI 主产品的全部内容吗?否。本仓库有意排除了 Pro 和 Beta 组件,以及任何身份验证、账户状态或结账逻辑;仅包含免费的社区版变体。
社区版目录有多大?社区版目录共包含 50 个社区版父组件,覆盖 111 个路由,另有 141 个免费变体记录和 23 个单例组件,共计 164 条浏览结果。
如果我需要 Pro 组件,该怎么获取?Pro 源码未发布到 npm。当前有效的 Pro 会员可以在浏览器中通过 OAuth 与 PKCE 进行身份验证,然后使用公开的 CLI(npx @designcodeio/threeui-cli)下载其有权访问的源码包。除非传入 --force,否则它不会覆盖你已修改的项目文件。
这个仓库如何与私有的主项目保持同步?每次成功推送到私有 ThreeUI 仓库的 main 分支后,同步任务会过滤掉 Pro/Beta 内容、保留免费的元数据,并在本仓库中发起一个经过审核的拉取请求,随后触发一次带 provenance 的 npm 发布。
我能在本地运行和构建这个仓库吗?可以。npm 脚本提供了开发服务器(vite)、完整的发布边界/类型/生产构建检查(build:site),以及用于构建 npm 包的独立库构建(build:lib)。
Creator
MengTo
Size
41.6 MB
Stars
6.7K
Updated
CommitSep 01
Age
1mo
Commits · 90 Days