Hero made by @ybouane.

@crazygl/hero-origami

Paper polygons fold and unfold as they drift across soft directional light. Each shape has its own crease line and fold cycle.

Demo

Floating Origami

Install

npm install @crazygl/hero-origami

Usage

import FloatingOrigami from '@crazygl/hero-origami';

export default function Page() {
  return (
    <FloatingOrigami
      heading="Folded."
      shapeCount={8}
      foldSpeed={1}
      paperColor="#fff8ef"
    />
  );
}

Customise

• Content — contentType, heading, subheading, columns / custom node.
• Background — transparent, bgTop, bgBottom.
• Paper — paperColor, shadeColor, accentColor (lit), shapeCount, foldSpeed, drift, spin.

Best for

• Stationery and print-design studios.
• Craft and education brands.
• Art-direction portfolios.
• Calm wellness or editorial product pages.

This hero is part of CrazyGL, a collection of production-ready WebGL, canvas, 3D, and typography effects. Every CrazyGL hero ships with an agent-ready SKILL.md file that helps developers and coding agents adapt the effect into custom landing pages and interactive experiences.