Figma plugin liveInstall

ASCII gradient generator

Color through ASCII

Turn your gradient into colored characters. Choose your symbols, adjust their density, and export the result as an image or animation.

ASCIIASCIIisn'tisn'taboutaboutblackblackandandwhite.white.It'sIt'saapost-processingpost-processingfilterfilterthatthattransformstransformsyouryourfull-colorfull-colorgradientgradientintointotypographictypographicart.art.EveryEverycharactercharacterinheritsinheritsthetheunderlyingunderlyingcolors.colors.WarpsWarpsbend.bend.MaterialsMaterialsshimmer.shimmer.GlowGlowradiatesradiatesthroughthroughtext.text.

Start with your colors

How to make an ASCII gradient

An ASCII gradient uses brightness to select characters across a grid. In GradientLab, it is a visual effect on your gradient: keep the underlying colors or choose a single color for a terminal-style result.

  1. 01

    Build the gradient

    Open the editor and choose your gradient type and colors. Start with distinct light and dark areas so the character pattern has something to follow.

  2. 02

    Turn on ASCII

    In Effects, enable ASCII. Choose a Preset such as Classic, Blocks or Binary, or enter your own Characters. Use Colored to keep your palette, or Mono for a single character color.

  3. 03

    Dial in the texture

    Raise Density for more, smaller characters; lower it for larger symbols. Adjust Background for contrast. If the pattern feels reversed, try Invert before changing your palette.

Text-Based Rendering

Color through
typography.

In colored mode, each character samples the underlying gradient's color. Pink, cyan, purple—your entire palette flows through text. Warps distort the characters. Materials add shimmer.

Add perspective to tilt characters into 3D space. Enable glow to make text radiate with color. Layer ASCII over any gradient type—spiral, aurora, radial, all work beautifully.

Perspective

3D tilt depth

Glow

Color radiates

Materials

Iridescent, velvet

3D Perspective

Characters in space.

Tilt your ASCII grid on X and Y axes to create depth. Characters recede into the distance, creating a 3D plane that moves with your gradient animation.

Tilt X & Y

Independent control over horizontal and vertical tilt. Create subtle depth or dramatic perspective.

Color Preservation

Perspective warps the grid, not the colors. Your gradient's full palette remains vibrant across the tilted plane.

Animated Depth

Animation flows through the perspective, creating dynamic movement that respects the 3D space.

Character Glow

Glow

Each character radiates with its underlying color. The glow feature adds soft luminosity that makes your ASCII gradient feel alive, like neon signs made of text.

Full Color

Color rendered as text.

Your gradient's entire spectrum flows through typographic characters. Warps bend the grid. Materials add iridescence. Animation brings it all to life.

From characters to a finished asset

A visual effect, not a text file

The characters are rendered into the artwork. Export an image or animation to preserve the look; this is not a plain-text ASCII download or a CSS text-gradient generator. Copying CSS does not reproduce the ASCII effect.

Still or moving

Use PNG for a still. With animation enabled, the character pattern follows the changing gradient; GIF, MP4 and WebM are Pro export options. Check the result at its intended display size so the characters remain legible.

Compare image and animation export formats

Your colors,
in characters.

ASCII as a creative filter. Full-spectrum color, 3D perspective, glowing characters. Transform any gradient into typographic art.

Free tier available•Free PNG export · Pro GIF, MP4, WebM•No watermarks at $8/mo