# ASCII backgrounds > 16 animated backgrounds, cities and painted landscapes, drawn with real glyphs by the asciicn engine. Each one is a single React component you install with the shadcn CLI. Gallery: https://asciicn.dev/backgrounds. > For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. The asciicn agent skill, for building any ASCII effect on the engine, is at [/.well-known/agent-skills/asciicn/SKILL.md](/.well-known/agent-skills/asciicn/SKILL.md). Every background follows the `--ascii-*` theme tokens, holds one still frame under `prefers-reduced-motion`, and pauses offscreen and in hidden tabs. Each accepts the engine's look props (`charset`, `colorMode`, `phosphor`, `ramp`, `fx`, `cell`, `speed`) and a `handle` for export. Put one behind your content with `absolute inset-0`. ## Cities - **Miami** (`miami`): Ocean Drive at nightfall in dots: art deco hotels with soft neon on their stepped parapets, palms in silhouette, the glass towers of Brickell in blue haze and a bay holding the neon in broken reflections. Docs: https://asciicn.dev/docs/backgrounds/miami.md. Install: `npx shadcn@latest add https://asciicn.dev/r/miami.json` - **Tokyo** (`tokyo`): Tokyo at night in coloured dots, built in 3D: the Tokyo Skytree in pale blue light over a dense city that runs to the horizon, with neon on the near streets, Tokyo Tower small in the distance and a moonlit Mount Fuji under a teal sky. Docs: https://asciicn.dev/docs/backgrounds/tokyo.md. Install: `npx shadcn@latest add https://asciicn.dev/r/tokyo.json` - **New York** (`new-york`): Manhattan at dusk across the East River: the Empire State Building's lit spire, the Chrysler crown and One World Trade Center against an amber-to-blue sky, with soft window light, broken reflections and a slow ferry. Docs: https://asciicn.dev/docs/backgrounds/new-york.md. Install: `npx shadcn@latest add https://asciicn.dev/r/new-york.json` - **Paris** (`paris`): Paris at blue hour, built in 3D and printed in dots: the Seine runs between stone quays and Haussmann blocks to the Eiffel Tower, lit gold from within, its reflection broken by slow ripples. Docs: https://asciicn.dev/docs/backgrounds/paris.md. Install: `npx shadcn@latest add https://asciicn.dev/r/paris.json` - **London** (`london`): Westminster at dusk in dots, modelled in 3D: the floodlit Elizabeth Tower with its clock faces glowing, the Palace of Westminster receding along the river to the Victoria Tower, Westminster Bridge and its lamps, and the Thames mirroring it all under a pale gold to slate sky. Docs: https://asciicn.dev/docs/backgrounds/london.md. Install: `npx shadcn@latest add https://asciicn.dev/r/london.json` - **Dubai** (`dubai`): Dubai at dusk from the desert in dots: the Burj Khalifa rising far above a cluster of towers in blue haze, its stepped spire gold in the last light, over rose and amber dunes under a gold-to-blue sky. Docs: https://asciicn.dev/docs/backgrounds/dubai.md. Install: `npx shadcn@latest add https://asciicn.dev/r/dubai.json` - **San Francisco** (`san-francisco`): The Golden Gate Bridge at blue hour in halftone dots: Art Deco towers in International Orange catching the last light, fog rolling under the deck and over the Marin Headlands, city lights on the far shore and the bay mirroring the afterglow. Docs: https://asciicn.dev/docs/backgrounds/san-francisco.md. Install: `npx shadcn@latest add https://asciicn.dev/r/san-francisco.json` - **Hong Kong** (`hong-kong`): Victoria Harbour at blue hour in coloured dots: lit towers climbing to the misty ridge of Victoria Peak, the Bank of China Tower and Two IFC, long reflections and a red-sailed junk under a magenta to deep blue sky. Docs: https://asciicn.dev/docs/backgrounds/hong-kong.md. Install: `npx shadcn@latest add https://asciicn.dev/r/hong-kong.json` - **Rio de Janeiro** (`rio`): Rio de Janeiro at dusk from the water in dots: Sugarloaf beside Morro da Urca with one cable car crossing, Christ the Redeemer pale on Corcovado, and the lamps of Copacabana curving along the shore under a gold to violet sky. Docs: https://asciicn.dev/docs/backgrounds/rio.md. Install: `npx shadcn@latest add https://asciicn.dev/r/rio.json` - **Sydney** (`sydney`): Sydney Harbour at blue hour in halftone dots: the Opera House's sails catching a warm glow, the Harbour Bridge with its lamps lit, the city in cool haze and the harbour mirroring them under a peach afterglow. Docs: https://asciicn.dev/docs/backgrounds/sydney.md. Install: `npx shadcn@latest add https://asciicn.dev/r/sydney.json` ## Landscapes - **Redwood light** (`redwood-light`): A redwood forest in early morning: giant trunks fading into blue-green haze, golden light shafts slanting onto a fern floor, and slow motes drifting in the light. Docs: https://asciicn.dev/docs/landscapes/redwood-light.md. Install: `npx shadcn@latest add https://asciicn.dev/r/redwood-light.json` - **Balloon valley** (`balloon-valley`): Early morning over a river valley in halftone dots on cream: cool blue hills fading into haze, pale gold mist, a river catching the low sun and hot-air balloons at different depths. Docs: https://asciicn.dev/docs/landscapes/balloon-valley.md. Install: `npx shadcn@latest add https://asciicn.dev/r/balloon-valley.json` - **Canyon river** (`canyon-river`): A desert canyon in late golden hour from a high rim: sunlit terracotta walls with blue shadows step back to glowing buttes while a river winds below, mirroring the blue sky. Docs: https://asciicn.dev/docs/landscapes/canyon-river.md. Install: `npx shadcn@latest add https://asciicn.dev/r/canyon-river.json` - **Lighthouse** (`lighthouse`): A lighthouse on a rocky headland at blue hour, its lamp glowing amber over a calm sea, painted in halftone dots. Docs: https://asciicn.dev/docs/landscapes/lighthouse.md. Install: `npx shadcn@latest add https://asciicn.dev/r/lighthouse.json` - **Glacier lagoon** (`glacier-lagoon`): Icebergs glowing blue-white on a glassy lagoon below a glacier and dark peaks, under a midnight sun sitting gold and rose on the horizon. Docs: https://asciicn.dev/docs/landscapes/glacier-lagoon.md. Install: `npx shadcn@latest add https://asciicn.dev/r/glacier-lagoon.json` - **Rice terraces** (`rice-terraces`): Flooded rice terraces at a fresh dawn: silver-blue fields between dark earthen banks with lit grassy tops, mist in the valley and far ridges fading into haze. Docs: https://asciicn.dev/docs/landscapes/rice-terraces.md. Install: `npx shadcn@latest add https://asciicn.dev/r/rice-terraces.json` ## Use one ```tsx import { Tokyo } from "@/components/asciicn/tokyo"; export const Hero = () => (

Your headline

); ``` Shader fields (nebula, prism, ionize, squall, satin) and 3D scenes are in the [catalog](https://asciicn.dev/docs/examples.md). To build one that isn't here, install the agent skill (`npx shadcn@latest add https://asciicn.dev/r/asciicn-skill.json`) and read [Write your own](https://asciicn.dev/docs/engine/write-your-own.md).