Ways to use animated ASCII art

18 guides, each with a live builder, code to copy and files to download. READMEs, websites, terminals, wallpapers, thumbnails, slides and more.

README

Animated ASCII art for a GitHub README

Put an animated ASCII banner, scene or loader at the top of your GitHub README. Copy a GIF or SVG, no build step, works in GitHub's dark and light themes.

Website

An animated ASCII hero for GitHub Pages

Add a live, animated ASCII art hero to a GitHub Pages or personal website with one script tag. No framework, no build step, under 10 KB per piece.

Terminal

A terminal welcome screen with animated ASCII art

Show an animated ASCII piece every time you open a terminal, or set a still one as your server's message of the day. Works with zsh, bash and fish.

CLI

Splash screens and loaders for command line tools

Give your CLI a startup splash or an animated loader in ASCII. Copy the piece source into your Node project, or print frames from any language.

Loader

ASCII loading spinners and progress bars for websites

Lightweight animated ASCII loaders, spinners and progress bars for web pages. One tag to embed, no images to download, honours reduced motion.

Error page

Animated ASCII art for 404 and error pages

Make a 404 or 500 page people remember with animated ASCII art. Ready-made error pieces plus any scene or creature, embedded with one tag.

Wallpaper

ASCII art wallpapers for desktop and phone

Download ASCII art wallpapers in 4K, 1080p and phone sizes. Pick any scene, choose dark or light, and export a full-resolution PNG in one click.

YouTube

ASCII art for YouTube thumbnails

Export any animated ASCII piece as a 1280 by 720 YouTube thumbnail background, then add your title on top in any editor.

Social

ASCII art headers for X, LinkedIn and GitHub

Export ASCII art at the exact sizes for an X header, a LinkedIn banner and a GitHub social preview image.

Docs

ASCII art for docs sites and landing pages

Add animated ASCII art to docs and landing pages built with Next.js, Astro, Docusaurus or plain HTML. Diagrams, terminals and heroes that load instantly.

Chat

ASCII art you can paste into Discord and Slack

Copy any ASCII piece as plain text and paste it into Discord, Slack or Teams inside a code block, so it keeps its shape.

Code

ASCII art headers for source code comments

Copy ASCII art and block-letter banners as text for file headers and section comments in your code.

OBS

Animated ASCII overlays for OBS and streams

Use animated ASCII art as a browser source in OBS or Streamlabs for starting soon screens, borders and overlays.

Slides

ASCII art for slides and presentations

Drop animated ASCII art into Keynote, PowerPoint or Google Slides as a GIF or video, for title slides and section breaks.

Portfolio

ASCII art for a developer portfolio

Make a developer portfolio stand out with an animated ASCII hero, a terminal-style about section and live ASCII charts.

Dashboard

ASCII charts for status pages and dashboards

Animated ASCII bar charts, gauges, sparklines and uptime bars for status pages, internal dashboards and terminal tools.

AI agent

ASCII art with AI coding agents

Tell Claude, Cursor or any AI coding agent to add an animated ASCII piece to your project. Copy-paste instructions included.

Email

ASCII art GIFs for newsletters and email

Export animated ASCII art as a GIF for newsletters and email, where scripts and video do not play.

/FAQS

Animated ASCII art use cases: frequently asked questions

How the guides and builders work, what you can export, and where animated ASCII art fits.

Q. What can I use animated ASCII art for?
You can use it almost anywhere text or images go: GitHub READMEs, website heroes, loading screens, 404 pages, terminal welcome screens, wallpapers, YouTube thumbnails, social headers, stream overlays, slides, newsletters and status screens. Each guide on this page covers one of those jobs with a live builder and code to copy.
Q. Which use case should I start with?
Start with the place your audience already looks. Developers usually start with a GitHub README or a terminal welcome screen, site owners with a website hero or a 404 page, and creators with a stream overlay, a YouTube thumbnail or a social header. Every guide works on its own.
Q. Do the use-case guides need any coding?
Most do not. Builders for wallpapers, thumbnails, headers, slides and email produce files you download. Guides for websites, READMEs and terminals give you code to paste, already filled in with your choices, so you only copy and paste it.
Q. How does a use-case builder work?
Each builder shows a realistic preview, such as a README, a browser, a terminal or a slide, next to a set of controls. As you change the piece, the look, the text and the colors, the preview and the generated code update instantly, and a link button saves your settings.
Q. Can I use any piece in any use case?
Yes. Every builder has a piece picker with suggestions for that job and the full library grouped by category. Scenes suit wallpapers and heroes, UI and loader pieces suit apps, and small characters suit READMEs and empty states.
Q. Which formats can I export?
Depending on the guide, you can export PNG images at exact platform sizes, animated GIFs, MP4 or WebM video at 1920 by 1080 or 4K, complete HTML pages, shell snippets, Markdown, and code files for several languages and frameworks.
Q. Will animated ASCII art slow down my website?
No in normal use. Each piece is a small JavaScript file, it only animates while it is on screen, and it holds a still frame for visitors who prefer reduced motion. The website and loader guides explain how to keep first paint fast.
Q. Can I put animated ASCII art somewhere scripts do not run?
Yes. For GitHub READMEs, email, chat apps and slides, the guides export a GIF, a video, an animated SVG banner or plain text instead of the live script, because those places block scripts.
Q. Are the pieces licensed for commercial use?
Yes. Every piece is MIT licensed, so you can use it in personal and commercial projects, including client work and monetized videos. A link back is appreciated but not required.
Q. Can I turn my own logo or photo into animated ASCII for these uses?
Yes, with the ASCII Magic editor. The library pieces are ready-made animations; the editor converts your own images and videos into ASCII and more than 100 other styles, which you can then use in any of these guides.