v1.2.1 Now Available

A Fun Terminal
For Your Website

Add an interactive terminal easter egg to your portfolio or website. Fully customizable themes, commands, and behaviors.

Get StartedView Docs
$npm install one-terminal
guest@demo:$  
Features

Everything You Need

A feature-rich terminal component that's easy to integrate and customize for any project.

Fully Themeable

Customize colors, fonts, and styles to match your brand. Supports custom CSS variables.

Built-in Commands

Ships with essential commands like help, cd, ls, cat, pwd, echo, and clear out of the box.

Window Chrome Options

Choose between macOS, Windows, Linux styles, or no chrome at all.

Customizable Cursor

Block, underline, or beam cursor styles with optional blinking animation.

Add Custom Commands

Easily extend with your own commands. Full TypeScript support included.

Lightweight & Fast

Zero dependencies, tree-shakeable, and optimized for performance.

Out the box

Built-in Commands

Everything you need for a realistic terminal experience, ready to use out of the box.

help

Display available commands

cd

Navigate between directories

ls

List directory contents

cat

Display file contents

pwd

Print working directory

echo

Output text to terminal

clear

Clear terminal screen

Make it your own

Highly Customizable

Personalize every aspect of the terminal to match your design. Try it below!

guest@~:$  
Theme
Window Chrome
Cursor Style
Free Component

Open Source MIT Component

one-terminal is licensed under an MIT License and it can be used everywhere for free. Contribution and feedback are always welcome in the one-terminal repository. Go leave me a star there!

Open GitHub
guest@~:$  

1Install

bash
npm install one-terminal

2Usage

tsx
1import { Terminal } from "one-terminal";
2 
3// Define your virtual file system
4const vfs = {
5  kind: "directory",
6  entries: {
7    "readme.txt": {
8      kind: "file",
9      fileType: "text",
10      content: "Welcome to One Terminal 👋",
11    },
12  },
13} as const;
14 
15export default function App() {
16  return <Terminal fileStructure={vfs} />;
17}
Installation

Quick Start

Get up and running in minutes. The only required prop is fileStructure which defines your virtual file system.

Learn more usage cases and explore advanced configurations in the full documentation.

View Documentation