Skip to main content
100%

Gist 585272

✓ Published0🌍 Public
XXXX
Last edited Sep 18, 2010
Created on Sep 18, 2010

This example visualizes the 256-color palette available in modern terminal emulators, dividing it into system colors, a 6x6x6 color cube, and a grayscale ramp. It uses a Perl script with ANSI escape sequences and terminal control codes to both define the RGB values for each color index and render swatches as colored background blocks. The code explicitly sets the color definitions via OSC sequences and displays them using SGR background escape codes, producing a direct textual grid of the palette.

AI-generated description

Similar vizzes

Loading thumbnail…

Gist 895787

This example displays all 256 xterm-256 color codes as colored text samples, each labeled with its numeric index. The script prints each color name “cool” in the corresponding ANSI escape sequence, using the `\e[38;5;` prefix to set the foreground color and `\e[0m` to reset it. The output is rendered directly to the terminal, showing the full palette in sequential order from 1 to 256. The Ruby code relies on standard output formatting rather than a visualization library.

XXXX
81% match
Loading thumbnail…

Gist ec761bad0f5e7bfb19f46d45ba0b3355

This example defines a small JavaScript utility that converts hexadecimal color codes into their red, green, and blue component values. The code presents the `hexToRgb` function, which first parses the hex string—overlooking an optional leading `#`—into an integer, then extracts the separate color channels using bit shifts and bitwise AND operations. The function returns an array of three numbers, each representing the intensity of a channel. This demonstrates a modular approach to color handling, using only core JavaScript without any external libraries or APIs.

MMAKIO135
68% match
Loading thumbnail…

Gist d3a333ed7104b0c42f06a400bbf84861

This example visualizes a hexagonal grid of Tmux panes, where each pane displays a short terminal command. The visualization uses D3.js with a force-directed layout (`d3.forceSimulation`) to position the hexagons, while `d3.geoPath` draws the closed paths for each hexagon. The color of each hex corresponds to a screenshot of an Arch Linux terminal, processed via Canvas `getImageData` to extract average pixel values. The layout is computed interactively, with forces repelling overlapping hexagons to avoid clutter. The data source is a GitHub gist containing shell commands for tmux configuration.

MMistyBlunch
68% match
Loading thumbnail…

Colors

This example demonstrates a color palette visualization, fetched dynamically from a GitHub Gist URL. The page uses a bare HTML structure with embedded JavaScript, relying on the browser’s native `fetch` API to retrieve the data. The code logs the fetch response to the console, showing the raw data payload as it arrives. No CSS styling or rendering logic is yet implemented, leaving the visual output undefined. The example serves as a minimal starter for displaying color-related data using standard web technologies.

OOrvybr0wn1
65% match
Loading thumbnail…

Gist 82f1941cefca78989adf

This visualization presents a text-based cheat sheet for tmux, organized into sections for commands, controls, sessions, windows, and panes. The data is plain terminal text formatted with ASCII art tables and separators, rendered likely as an HTML document. The implementation uses standard web technologies, with CSS for styling the preformatted text blocks, tables, and syntax-like highlighting. It does not employ JavaScript visualization libraries, SVG, or canvas rendering; instead, it relies on static markup and typography to convey the hierarchical command structure. The example focuses on clarity of textual information rather than graphical encoding.

PP7h
65% match
Loading thumbnail…

Colours Page

A gallery of CSS color names rendered as a grid of rounded rectangles, each labeled with its own name. The page reads a CSV file listing color names and displays them grouped by hue families. Using D3 v6 and SVG, the code appends a small `<svg>` per color, fills a rectangle with the named color via the `style` property, and adds a text label with a white shadow for legibility. The layout is a simple vertical list rather than a compact mosaic, and a few colors are omitted from the source data.

Dd3noob
65% match
Loading thumbnail…

Fork of Automatic Color Schemes

This example shows how color schemes can be automatically generated from configurations of hue, saturation, and luminance, displayed as vertical gradient bars across the screen. The code uses `d3.cubehelix` to define dark and light endpoints for each hue, then `d3.interpolateCubehelix` and `d3.range` to create seven-step gradients from those endpoints. It renders the resulting colors as adjacent SVG rectangles, with each rect slightly overlapping to produce seamless transitions. A CSV file provides a selected index, though the current code only reads it without affecting the visible output.

HHaili0109
64% match
Loading thumbnail…

Colours Page

This example displays a grid of named CSS colors, each rendered as a rounded rectangle with its name printed in bold text. The visualization uses a static CSV file (`colours2.csv`) containing color names, and the D3.js library to create an SVG element for each entry. The code places each color swatch and label sequentially, using D3’s `select`, `append`, and `attr` methods to build the layout. It also applies a text-shadow class to improve label legibility, and the resulting page is a reference guide for color names usable in web contexts.

Dd3noob
64% match