Frames·@exepert/ui / CrtBootScreen

Boot Screen

A BIOS-style start-up log typed out on a CRT tube, with counting steps.

Open in Playground ↗All components

Variants and states

3 copy-ready examples

BIOS start-up

A memory count and device checks, typed out line by line.

Open in Playground ↗

Preview loads on approach

import { CrtBootScreen } from "@exepert/ui";
import "@exepert/ui/styles.css";
export default function Example() {
  return (
    <CrtBootScreen label="Boot sequence" />
  );
}

Usage

Use it as a playful loading or intro moment. Supply your own lines, set the pace, and loop it for ambient displays.

Props

preset: CrtPresetName
effects: Partial<CrtEffects>
lines: Array<string | { prefix, from, to, suffix?, durationMs? }>
speed: number
loop: boolean
onComplete: () => void
label: string

Accessibility

The whole log is available to assistive technology from the first render; the typing is visual only.
Under reduced motion the log appears at once.

Install

Install the pinned public release, then import the component and stylesheet.

npm install @exepert/ui@0.1.1

import { CrtBootScreen } from "@exepert/ui";

import "@exepert/ui/styles.css";