Skip to content

index.md

Latest commit

 

History

History
107 lines (81 loc) · 3.48 KB

index.md

File metadata and controls

107 lines (81 loc) · 3.48 KB
title Home
description textmode.js is a lightweight creative coding library for creating real-time ASCII art on the web.
keywords textmode, ascii art, creative coding, webgl, javascript library, generative art, real-time, canvas, visualization, retro, 8-bit, terminal, petscii, live coding
layout home
hero
text actions
textmode.js
theme text link
brand
Get started
/docs/introduction
theme text link
alt
View examples
/docs/examples
features
icon title details
src
/svg/realtime.svg
Real-time performance
Blazing fast ASCII conversion powered by an optimized WebGL2 rendering pipeline specifically designed for textmode art.
icon title details
src
/svg/agnostic.svg
Framework-agnostic
Apply textmode conversion to any existing <canvas> and <video> context. Compatible with p5.js, Three.js, and much more.
icon title details
src
/svg/dependencies.svg
Zero dependencies
Lightweight and self-contained. No external libraries required - just import and start creating.
icon title details
src
/svg/crossplatform.svg
Cross-platform
Runs everywhere the web runs - desktop, mobile, tablets. Full TypeScript support with comprehensive type definitions.
icon title details
src
/svg/easytouse.svg
Easy integration
Simple and intuitive API designed for quick setup and seamless integration into your projects.
icon title details
src
/svg/export.svg
Export anything
Export your creations as TXT, SVG, GIF, video, and image. Perfect for sharing on social media, printing, or integrating into other projects.

textmode.js - Real-time ASCII art for the web

Lightweight creative coding library for real-time textmode graphics in the browser.

What is textmode.js?

textmode.js brings the art of ASCII and textmode graphics into the modern web. Built for developers from all corners and skill levels of the creative coding world - it's the tool I wished existed when I started exploring textmode art.

Ready for production, built for creativity

A library designed for building generative art installations, retro games, interactive visualizations, live coding performances, and experimental web experiences. Whether you're prototyping an idea or shipping a production app, textmode.js has you covered.

Shape the future of textmode graphics. Your feedback, ideas, and creations help drive development. Join our Discord to share what you're building, get support, and connect with fellow textmode enthusiasts.

From zero to textmode in minutes

const tm = textmode.create();

tm.draw(() => {
  tm.background(0, 0, 0, 0);
  
  const halfCols = tm.grid.cols / 2;
  const halfRows = tm.grid.rows / 2;
  
  for (let y = -halfRows; y < halfRows; y++) {
    for (let x = -halfCols; x < halfCols; x++) {
      const dist = Math.sqrt(x * x + y * y);
      const wave = Math.sin(dist * 0.2 - tm.frameCount * 0.1);
      
      tm.push();
      tm.translate(x, y, 0);
      tm.char(wave > 0.5 ? '▓' : wave > 0 ? '▒' : '░');
      tm.charColor(0, 150 + wave * 100, 255);
      tm.point();
      tm.pop();
    }
  }
});

Simple, powerful, and ready for your wildest ideas.