🎨 Font Bot CLI — Premium Edition

A powerful, interactive command-line tool to search, preview, download, and style code files with any of the 1900+ Google Fonts — right from your terminal.

✨ Features

🔍 Interactive Font Explorer

• Search by Name — Type a partial name (e.g., "Rob") and instantly filter through 1900+ Google Fonts.
• Filter by Category — Browse fonts organized by Serif, Sans-Serif, Display, Monospace, and Handwriting.
• Random Font Picker — Feeling adventurous? Let the bot surprise you.

💾 Font Downloader & CSS Generator

• Multi-Weight Download — Select specific weights/styles (e.g., regular, 700, italic) to download as .ttf files.
• Auto-Generated CSS — Automatically creates a fonts.css file with correct @font-face rules, ready to drop into your project.
• Organized Output — Downloads are saved to ./downloaded-fonts/<font-family>/.

🌐 Live Browser Preview

• Interactive Playground — Opens a sleek, dark-themed HTML page in your browser with live controls for font size, weight, and custom text.
• All Weights Displayed — See every available style/weight of the font rendered side-by-side.

📄 Style & Export Local Files

• Parse Any Code File — Point it at any local file (e.g., src/index.ts, app.py, styles.css) and render the contents styled in your chosen Google Font.
• Syntax Highlighting — Powered by Prism.js with support for TypeScript, JavaScript, Python, CSS, HTML, JSON, Markdown, and more.
• 4 Premium Themes — Choose from:
  • 🌙 Tomorrow Night — Sleek dark (default)
  • 🔥 Okaidia — Warm Monokai-style dark
  • 🌅 Twilight — High-contrast retro dark
  • ☁️ Coy — Clean, minimalist light
• Line Numbers — Toggle line numbers on/off.
• Export to HTML — Save the styled code as a standalone .html file alongside the downloaded font.

⚙️ Floating Browser Dashboard

When previewing styled code in the browser, a floating control panel appears with:

• Font Size Slider — Adjust code text size from 12px to 64px in real-time.
• Theme Switcher — Hot-swap syntax themes without regenerating the page.
• Copy Embed Snippets — One-click copy of the Google Fonts <link> tag and CSS font-family rule.

🚀 Scriptable CLI Mode

Skip the interactive menus entirely with command-line flags for CI/CD pipelines and automation:

# Show help
node bin/rasul17bot.js --help

# List first 50 Google Fonts
node bin/rasul17bot.js --list

# Download all weights of a font
node bin/rasul17bot.js --font "Roboto" --download

# Style a file and open browser preview
node bin/rasul17bot.js --font "Fira Code" --preview src/index.ts

# Clear cached font data
node bin/rasul17bot.js --clear-cache

⚡ Offline-First Caching

• Font metadata is cached locally in .font-cache.json (expires after 24 hours).
• Subsequent launches are near-instant — no API call needed.
• If the API is down, the cache acts as a resilient fallback.

📦 Installation

Prerequisites

• Node.js v18 or later
• A Google Fonts API Key

Setup

# Clone the repository
git clone <repo-url>
cd font-bot

# Install dependencies
npm install

# Create your .env file
echo "GOOGLE_FONTS_API_KEY=your_api_key_here" > .env

# Compile TypeScript
npx tsc

🚀 Usage

Interactive Mode (Full Menu)

node bin/rasul17bot.js

This launches the interactive CLI with the following flow:

┌  Font Bot CLI - Premium Edition
│
◇  Successfully loaded 1945 Google Fonts!
│
◆  What would you like to do?
│  > 🔍 Search Fonts by Name
│    📁 Filter Fonts by Category
│    🎲 Select a Random Font
│    🧹 Clear Local Cache & Re-fetch
│    ❌ Exit
└

After selecting a font, the Font Actions Menu appears:

◆  What would you like to do with Roboto?
│  > 💾 Download Font files & CSS
│    🌐 Open Live Browser Preview
│    📄 Style & Export Local File
│    🎨 View CLI Art Preview (cfonts)
│    🔙 Back to Main Menu
└

Scriptable Mode (CLI Flags)

| Flag | Description | |---|---| | -f, --font "<name>" | Select a font family by name | | -c, --category "<name>" | Filter and list fonts by category | | -p, --preview "<path>" | Style a local file and open browser preview | | -d, --download | Download all font weights + generate CSS | | --list | Print first 50 fonts and exit | | --clear-cache | Clear local font cache and exit | | -h, --help | Show help documentation |

Examples:

# Download Roboto to ./downloaded-fonts/roboto/
node bin/rasul17bot.js --font "Roboto" --download

# Preview your Python script styled in Fira Code
node bin/rasul17bot.js --font "Fira Code" --preview app.py

# Browse all monospace fonts
node bin/rasul17bot.js --category "monospace"

📂 Project Structure

font-bot/
├── bin/
│   └── rasul17bot.js        # CLI entry point (ESM loader)
├── src/
│   ├── index.ts             # Main CLI logic, menus, HTML generators
│   └── font.ts              # Google Fonts API client + caching layer
├── dist/                    # Compiled JavaScript output
├── downloaded-fonts/        # Downloaded font files + CSS (generated)
├── .env                     # Google Fonts API key
├── .font-cache.json         # Cached font metadata (auto-generated)
├── font-preview.html        # Live font preview (auto-generated)
├── font-code-preview.html   # Styled code preview (auto-generated)
├── package.json
├── tsconfig.json
└── README.md

🧪 Testing

Run these commands to verify everything works:

# 1. Compile TypeScript (should complete with zero errors)
npx tsc

# 2. Test help flag
node bin/rasul17bot.js --help

# 3. Test font listing
node bin/rasul17bot.js --list

# 4. Test downloading a font
node bin/rasul17bot.js --font "Roboto" --download

# 5. Test styling a file with browser preview
node bin/rasul17bot.js --font "Open Sans" --preview src/index.ts

# 6. Test full interactive mode
node bin/rasul17bot.js

🛠️ Tech Stack

| Technology | Purpose | |---|---| | TypeScript | Type-safe application logic | | Node.js (ESM) | Runtime environment | | @clack/prompts | Beautiful interactive CLI prompts | | cfonts | ASCII art banner rendering | | node-fetch | HTTP client for API requests and file downloads | | dotenv | Environment variable management | | Prism.js (CDN) | Syntax highlighting in browser previews | | Google Fonts API | Font metadata and file sources |

👤 Author

Rasul Ahmed Khan

📄 License

ISC