Installation
Initialize the theme, then add a component. The files land in your repo. That is the default.
CLI
npx @neelshha/ui@latest init
npx @neelshha/ui@latest add glide-tabsinit writes ns.json, tokens.css, fonts.css, cx.ts, theme.tsx, and theme-provider.tsx. It looks for Next or Vite and picks src/components/ui when src exists.
Import tokens
Once, in your global CSS. If the project has a @/ alias (Next usually does), init prints that path:
@import "@/components/ui/tokens.css";
@import "@/components/ui/fonts.css";On Next you can skip the font import and self-host with next/font — set the --font-onest and --font-dm-mono variables the tokens read.
Vite often has no @/. Init will say so and print a path relative to a CSS file in src/:
@import "./components/ui/tokens.css";
@import "./components/ui/fonts.css";Component CSS is imported from the TSX. You do not import glide-tabs.css yourself.
Next.js
Inject THEME_SCRIPT with next/script before the page is interactive so the first paint is not wrong. Do not render a raw <script> from a React component — Next 16 will refuse it. Wrap the tree in ThemeProvider. Add suppressHydrationWarning on <html>.
import Script from "next/script";
import { ThemeProvider } from "@/components/ui/theme-provider";
import { THEME_SCRIPT } from "@/components/ui/theme";
<html lang="en" suppressHydrationWarning>
<body>
<Script id="ns-theme" strategy="beforeInteractive">
{THEME_SCRIPT}
</Script>
<ThemeProvider>{children}</ThemeProvider>
</body>
</html>Vite or React
Same provider. Put ThemeScript first in the root, or paste the script into index.html. If @/ is missing, import the copied files with a relative path.
Appendix: package import
This repo also publishes @neelshha/ui if you want the package instead of copied source. Import tokens once. Component CSS arrives with the module. Vite and webpack need to transpile the TypeScript, or import a single file:
import { GlideTabs, MorphMenu } from "@neelshha/ui";
import "@neelshha/ui/tokens.css";
// or
import { GlideTabs } from "@neelshha/ui/glide-tabs";styles.css is an optional barrel if you want every component's CSS without importing the modules.