Scaffold Text

A premium, modular React component from the React Bytes collection. Built with React and TypeScript.

Installation

npm install @reactbytes/scaffold-text

Usage

import { ScaffoldText } from "@reactbytes/scaffold-text";

export default function Example() {
  return (
    <ScaffoldText />
  );
}

Properties

| Prop | Type | Default | Description | | :--- | :--- | :--- | :--- | | text | string | SCAFFOLD | The word/text to render and assemble. | | animationState | select | enter | Lifecycle stage of assembly/collapse animation. | | fontSize | number | 80 | Scale of typography size in pixels. | | transitionSpeed | number | 0.04 | Assembly animation speed coefficient. | | influenceRadius | number | 65 | Distance threshold for cursor repulsion interaction. | | color | color | #ffffff | Foreground color of stable character vectors. | | scaffoldColor | color | rgba(14, 165, 233, 0.4) | Color of temporary scaffolding framework lines. |

Presets

This component includes the following design presets:

• Cyber Scaffolding (Default) (cyber)
• Fast Assembly (fast)
• Slow Blueprint (slow)

Credits & Inspiration

Component Source

• ChandruMIT-o - Design & Development

For interactive playgrounds, customizable controls, and code copy-pasting, visit the full showcase page at React Bytes - Scaffold Text.