Installation

1. Install the package

npm install neoterm-ui
# or
pnpm add neoterm-ui
# or
bun add neoterm-ui

2. Import the styles

Add the base stylesheet to your root layout or global CSS file:

// app/layout.tsx or app/globals.css
import "neoterm-ui/styles";

This provides CSS custom properties (colors, neon accents, fonts), animation keyframes, and base utility classes.

3. Use components

import { TerminalBox, GlowText, Button } from "neoterm-ui";

export default function Page() {
  return (
    <TerminalBox title="hello.sh">
      <GlowText color="green">Hello, NeoTerm!</GlowText>
      <Button>Click me</Button>
    </TerminalBox>
  );
}

Peer dependencies

NeoTerm UI requires:

• react ^18.0.0 || ^19.0.0
• react-dom ^18.0.0 || ^19.0.0

Tailwind CSS configuration

NeoTerm UI uses Tailwind CSS 4 with CSS custom properties. If your project uses Tailwind, the library’s styles integrate automatically via the imported stylesheet. No extra Tailwind config is needed.