/project

snake-loader/

> cat README.md

A tiny React loader that plays Snake on an 8×8 grid. 24×24px by default, so it fits inline in a button or form instead of taking over the page. The snake wanders, eats, grows, and resets when it traps itself. Four themes. Zero dependencies. ~4kb gzipped. MIT.

install

npm install @scoobynko/snake-loader

usage

import { SnakeLoader } from "@scoobynko/snake-loader";
import "@scoobynko/snake-loader/styles.css";

<SnakeLoader />                 // 24×24px, nokia theme
<SnakeLoader theme="neon" />    // glow + pulse
<SnakeLoader cellSize={6} />    // 48×48px

props

proptypedefaultdescription
theme"nokia" | "neon" | "minimal" | "custom"nokiaVisual preset.
cellSizenumber3Px per cell. Grid is fixed 8×8.
speednumber10Cells per second.
colors{ snake?, food?, grid?, background?, glow? }-Override any color token.
effects{ glow?: boolean, pulse?: boolean }-Toggle visual effects.
pausedbooleanfalsePause tick loop.
aria-labelstringLoadingA11y label.

playground

Play with it. “copy code” gives you the JSX. “copy ai prompt” hands you a prompt you can drop into Claude, Cursor, or any coding agent to have them build this exact loader for you.

theme
size & motion
effects
colors
snake
food
grid
background
glow

> ls connect/

>cookies: analytics + session replay. details