Rampa Color Palette Generator

Installation

# Run directly
npx @basiclines/rampa -C "#3b82f6"

# Or install globally
npm install -g @basiclines/rampa

Quick Examples

Generate a basic 10-color palette

rampa -C "#3b82f6"

Output as CSS variables

rampa -C "#3b82f6" -O css --name=primary

:root {
  --primary-0: #000000;
  --primary-1: #1e3a5f;
  --primary-2: #2d5a8a;
  ...
}

Output as JSON

rampa -C "#3b82f6" -O json

Add complementary harmony

rampa -C "#3b82f6" --add=complementary -O css

Custom lightness and saturation ranges

rampa -C "#3b82f6" -L 15:95 -S 100:20

Use Fibonacci distribution scale

rampa -C "#3b82f6" --lightness-scale=fibonacci

Generate 5 colors with triadic harmony

rampa -C "#3b82f6" --size=5 --add=triadic -O css --name=brand

All Options

--color

-C

--size

--output

-O

text

json

css

--format

-F

hex

rgb

hsl

oklch

--name

--lightness

-L

15:95

--saturation

-S

100:20

--hue

-H

-10:10

--lightness-scale

--saturation-scale

--hue-scale

--add

--tint-color

--tint-opacity

--tint-blend

--no-preview

Scale Types

• linear

  - Even spacing (default)

• fibonacci

  - Fibonacci sequence

• golden-ratio

  - Golden ratio progression

• ease-in

  - Slow start, fast end

• ease-out

  - Fast start, slow end

• ease-in-out

  - Slow start and end

• geometric

  - Exponential growth

• logarithmic

  - Logarithmic curve

Harmony Types

• complementary

  - Opposite on color wheel (+1 ramp)

• triadic

  - 3 colors, 120° apart (+2 ramps)

• analogous

  - Adjacent colors, 30° apart (+2 ramps)

• split-complementary

  - 2 colors near opposite (+2 ramps)

• square

  - 4 colors, 90° apart (+3 ramps)

Blend Modes (for tinting)

normal

multiply

screen

overlay

darken

lighten

color-dodge

color-burn

hard-light

soft-light

When to Use This Skill

• User asks to "generate a color palette"
• User needs "CSS color variables"
• User wants "accessible colors" or "design system colors"
• User mentions "color ramp" or "color scale"
• User needs "complementary/triadic/analogous colors"
• User wants "perceptually uniform" colors
• User is building a theme or design tokens

Tips

1. For dark mode themes, use

   -L 5:85

   to avoid pure black/white
2. For muted palettes, use

   -S 60:20

3. Use

   --add=analogous

   for harmonious multi-color themes
4. Use

   -O json

   when you need to process colors programmatically
5. Combine with

   --size=5

   for minimal palettes