What is the difference between horizontalLayout and verticalLayout?

Horizontal layout composes the banner left-to-right within a single block, while vertical layout stacks blocks to produce a taller, narrower banner; both leverage FIGlet smushing/kerning options.

How do I ensure 80-column output does not wrap?

Keep width at 80 by configuring width=80 and choose a font and layout that fit within that width; if the terminal is narrower, use compact mode or reduce width to prevent wrapping.

How do I enable ANSI256 coloring without breaking alignment?

Set colorMode=ansi256 and provide colorStart/colorEnd values; ensure spaces are not colorized so the banner alignment remains intact, and validate both colored and plain outputs.

ascii-cli-logo-banner-figletjs

Scanned

npx machina-cli add skill partme-ai/full-stack-skills/ascii-cli-logo-banner-figletjs --openclaw

Files (1)

SKILL.md

2.6 KB

When to use this skill

CRITICAL TRIGGER RULE

Use this skill ONLY when the user explicitly mentions the exact skill name: ascii-cli-logo-banner-figletjs.

Trigger phrases include:

"ascii-cli-logo-banner-figletjs"
"use ascii-cli-logo-banner-figletjs"
"用 ascii-cli-logo-banner-figletjs 生成 TAAG/FIGlet 大字"
"使用 ascii-cli-logo-banner-figletjs 调 horizontalLayout / verticalLayout"

Boundary

Output copy-pastable text and layout rules only. Do not modify project code.
FIGlet/TAAG style is driven by FIGfont (.flf) rendering and layout “smushing/kerning” options.
ANSI coloring is optional and MUST not break alignment (spaces are not colorized).
Dependency note: figlet npm package is commonly used as the Node interface and is powered by figlet.js.

How to use this skill

Inputs (recommended)

brand (required)
width (default 80; if < 60 use compact mode)
font (default Standard)
horizontalLayout (default | full | fitted | controlled smushing | universal smushing)
verticalLayout (default | full | fitted | controlled smushing | universal smushing)
whitespaceBreak (true|false, default true)
slogan/hint (optional; centered lines under the logo)
center (default true)
rule (default true; set false for hero output)
version/repo/docs/author (optional; only used when rule=true)
colorMode (none | ansi256, default none; logo only)
colorStart/colorEnd (0-255, defaults 33/129; only when colorMode=ansi256)

Outputs (required)

bannerPlain: banner text (no-color)
coloredText: when colorMode=ansi256, provide colored logo output
plainTextFallback: when colored, also provide a no-color fallback (same layout)

Script

scripts/figlet_banner.mjs

Examples

examples/taag-figlet.md
examples/color-ansi256.md

Quality checklist

Layout options are honored (horizontal/vertical layout)
80-column output does not wrap; no trailing spaces
Color mode does not break alignment (spaces are not colorized)
Never prints secrets (tokens, internal URLs, personal data)

Keywords

English: ascii-cli-logo-banner-figletjs, figlet, figlet.js, FIGfont, taag, ascii, banner, smushing, kerning, ansi256 中文: ascii-cli-logo-banner-figletjs, FIGlet 大字, TAAG, FIGfont 字体, 横向布局, 纵向布局, ANSI256 上色

Source

git clone https://github.com/partme-ai/full-stack-skills/blob/main/skills/ascii-cli-logo-banner-figletjs/SKILL.mdView on GitHub

Overview

Generates TAAG/FIGlet-style ASCII art banners using figlet.js (FIGfont spec) with layout controls such as horizontal/vertical layout, width, and whitespaceBreak, plus optional ANSI 256 coloring. This helps you create bold, terminal-friendly logos for CLIs, READMEs, and docs while preserving alignment.

How This Skill Works

The skill renders text via figlet using a FIGfont (.flf) and applies layout options like horizontal or vertical arrangements and smushing/kerning. When colorMode is set to ansi256, it adds color to the logo without coloring spaces, ensuring the final banner remains alignment-safe within the configured width.

When to Use It

You explicitly mention the skill name ascii-cli-logo-banner-figletjs in chat or documentation.
You want to generate a TAAG/FIGlet-style banner for a CLI logo or project branding.
You need an 80-column-wide banner that does not wrap to multiple lines.
You want to apply ANSI 256 coloring to the banner without breaking alignment.
You want to add optional centered slogan lines beneath the logo.

Quick Start

Step 1: Install prerequisites (Node.js v18+, npm) and figlet (npm i figlet).
Step 2: Render a banner by configuring inputs (brand, width, font, horizontalLayout/verticalLayout, whitespaceBreak, colorMode).
Step 3: Run the script (scripts/figlet_banner.mjs) and verify 80-column alignment; adjust as needed and use plainTextFallback if coloring.

Best Practices

Honor and test both horizontal and vertical layout options to choose the most readable banner.
Aim for 80-column output; if the terminal is narrower, switch to compact/adjust width to prevent wrapping.
Ensure colorMode=ansi256 does not color spaces to preserve alignment and spacing.
Select an appropriate FIGfont (.flf) and tune smushing/kerning settings for legibility.
Leverage the slogan/hint input to place centered lines under the logo for branding.

Example Use Cases

CLI tool banner with Standard font and horizontal full layout at 80 columns.
README badge: ANSI256 colored banner using colorStart and colorEnd values.
Compact banner for terminals under 60 columns by adjusting width.
Vertical layout banner with a centered slogan beneath the logo.
Hero banner in help output with rule=false for clean emphasis.

Frequently Asked Questions

Add this skill to your agents