# retrostrap > A CSS+JS framework for building responsive, accessible websites that look like > the web of 1996-2003. Closed palette (216 web-safe plus the 16 classic named colors), > nine era font stacks, bevel components, and optional decoration widgets. ## Install https://cdn.jsdelivr.net/npm/retrostrap@0.1.0/dist/retrostrap.min.css (stylesheet) https://cdn.jsdelivr.net/npm/retrostrap@0.1.0/dist/retrostrap.min.js (enhancers; defer) Pick one theme: https://cdn.jsdelivr.net/npm/retrostrap@0.1.0/dist/themes/{name}.css and set . ## Reference - Cheatsheet: /cheatsheet.md, every class and widget, one page - manifest.json, the full catalog, structured (its `prompt` field is the system prompt) - guardrails.json, the five laws as data; validate against this - prompt.txt, a canonical system prompt to paste into an assistant ## The five laws 1. Palette: only the 224 legal colors, opaque. 2. Fonts: nine era stacks; sizes 10/13/16/18/24/32/48. 3. Shape: border-radius 0; shadow blur 0. 4. Motion: linear/steps easing only; honor prefers-reduced-motion. 5. Decency: no autoplay, no tracking, no external calls, works without JS. ## Components (63) - rs-alert: An inline message bar in info, warn and error flavors; no animation, it is just there. - rs-ascii: A 
 block for ASCII art and text banners, marked up as an image so readers announce a label, not every slash.
- rs-avatar: An 80×80 pixelated avatar image with a 1px border; --small drops it to 40×40.
- rs-award: A trophy-shelf block: one award image and the caption telling who gave it and when.
- rs-badge: Inline flashing tags, NEW!, UPDATED!, HOT!, COOL!, for links you touched this month.
- rs-banner: A 468×60 banner shell that scales proportionally below 500px, the one sanctioned proportional scale.
- rs-blink: Inline text that blinks at exactly one hertz.
- rs-blinkie: The ~150×20 glitter strip that declared your allegiances in a sidebar or signature.
- rs-breadcrumbs: The "You are here:" trail as an ordered list of links.
- rs-btn: The beveled system button; pressing it nudges the label one pixel down-right.
- rs-button88: The 88×31 button as an element: fixed size forever, built for badge walls.
- rs-card-profile: The member card: avatar, name, rank stars and a fields table.
- rs-center: Centers text and block children. Culturally load-bearing.
- rs-checkbox: The 13×13 sunken checkbox with a proper check glyph.
- rs-cols-2: Equal columns for badge walls and link farms. 4 → 2 → 1, 3 → 1, 2 → 1 as the screen shrinks.
- rs-construction: The permanently-temporary under-construction sign: a yellow board between caution bars.
- rs-container: Width governor: 760px by default, centered, fluid below its max.
- rs-counter: The sunken odometer shell for a hit counter; static digits work today, the hit-counter widget populates it later.
- rs-dialog: The native dialog in system-alert costume: titlebar, icon, message and button row over a dithered backdrop.
- rs-dos: A black terminal block on 
, with an optional C:\> title strip.
- rs-error-page: The 404 furniture: a DOS box with the status line and a link back home.
- rs-fieldset: Native fieldset and legend wearing the groove border.
- rs-figure: An image in a 2px outset frame with an optional sunken caption strip.
- rs-font-1: The seven sanctioned text sizes, 10px to 48px, as utility classes.
- rs-footer: The page footer kit: last-updated line, 88×31 badge wall, and a mailto.
- rs-form-table: The label:field two-column form grid, minus the table.
- rs-frames: Frameset cosplay: sticky side pane and main pane, each scrolling on its own, divided by a ridge.
- rs-gradient-text: Two-stop gradient display text in fire, ice, and toxic flavors.
- rs-hr: A wardrobe of horizontal rules for the semantic 
.
- rs-input: The sunken single-line text input.
- rs-kbd: A  dressed as a beveled keycap.
- rs-layout: Page-shape recipes via grid areas: sidebars, holy grail, portal thirds. Single column below svga.
- rs-list: A 
     with themed pixel markers in place of the stock disc.
- rs-loading: An hourglass with "Loading, please wait…"; the --bar variant adds an indeterminate progress bar.
- rs-marquee: Scrolling text at one of three sane speeds; pauses on hover and focus, stands still under reduced motion.
- rs-menu: A dropdown menu bar: nested list submenus open on hover and focus; the enhancer adds keyboard and tap.
- rs-navbar: A horizontal bar of bevel-chip links; the current page renders sunken.
- rs-note: A yellow sticky note with a hard shadow, for asides and webmaster's notes.
- rs-page: The opaque content sheet that sits on the tiled or colored body.
- rs-pagination: A page-number row: current page bracketed, Prev/Next in angle brackets.
- rs-panel: The general-purpose box: groove border with a title riding the line, fieldset-style.
- rs-progress: A segmented progress bar: sunken track, chunky accent blocks, optional marching indeterminate mode.
- rs-quote: The forum quote block: source strip, quoted body, and the signature divider.
- rs-radio: The 12×12 sunken pixel-circle radio; a dot appears when checked.
- rs-rainbow: Per-character rainbow text via a banded gradient, for headlines only.
- rs-rollover: The onmouseover swap, hide one thing, reveal another on hover or focus, in pure CSS.
- rs-select: A native