BlockDex

Components

Registries

Free blocks

Method

BlockDex

Components

Registries

Free blocks

Method

Open API

BlockDex

Components

Registries

Free blocks

Method

Open API

Components/@cellforge/cell-lattice-2

Prism Bloom

cellforge/cell-lattice-2
FreeComponent

Three rotating spokes sweep through the hex field with a soft outer shell pulse and a breathing center point.

Install it

npx shadcn@latest add https://cellforge.dev/r/cell-lattice-2.json

Source

components/ui/cell-lattice-2.tsxcellforge.dev/r/cell-lattice-2.json · first 6 KB
1"use client";
2
3import type { CSSProperties } from "react";
4
5import { cx } from "@/components/ui/cellforge-core";
6import { resolveDmxColorTokens } from "@/components/ui/cellforge-core";
7import { styleOpacity, stylePx } from "@/components/ui/cellforge-core";
8import { remapOpacityToTriplet } from "@/components/ui/cellforge-core";
9import { dmxBloomRootActive, dmxDotBloomParts } from "@/components/ui/cellforge-core";
10import { getPatternIndexes } from "@/components/ui/cellforge-core";
11import { useCellForgePhases } from "@/components/ui/cellforge-hooks";
12import { useCyclePhase } from "@/components/ui/cellforge-hooks";
13import { usePrefersReducedMotion } from "@/components/ui/cellforge-hooks";
14import type { CellForgeCommonProps } from "@/components/ui/cellforge-core";
15
16export type CellLattice2Props = CellForgeCommonProps;
17
18const ROW_COUNTS = [3, 4, 5, 4, 3] as const;
19const BASE_OPACITY = 0.08;
20const MID_OPACITY = 0.44;
21const HIGH_OPACITY = 0.98;
22const HEX_ROW_PITCH_RATIO = Math.sqrt(3) / 2;
23
24function hexPatternIndex(row: number, rowCount: number, col: number): number {
25 return row * ROW_COUNTS[2] + Math.floor((ROW_COUNTS[2] - rowCount) / 2) + col;
26}
27const SPOKE_WIDTH = 0.34;
28
29function clamp01(n: number | undefined) {
30 if (n == null || !Number.isFinite(n)) {
31 return;
32 }
33 return Math.min(1, Math.max(0, n));
34}
35
36function angularDistance(a: number, b: number): number {
37 const diff = Math.abs(Math.atan2(Math.sin(a - b), Math.cos(a - b)));
38 return Math.min(diff, Math.PI * 2 - diff);
39}
40
41function pointForCell(row: number, col: number): { angle: number; radius: number } {
42 const count = ROW_COUNTS[row] ?? 1;
43 const x = col - (count - 1) / 2;
44 const y = (row - 2) * HEX_ROW_PITCH_RATIO;
45 const radius = Math.sqrt(x * x + y * y);
46 return { angle: Math.atan2(y, x), radius };
47}
48
49function opacityForCell(row: number, col: number, phase: number): number {
50 const { angle, radius } = pointForCell(row, col);
51 if (radius < 0.01) {
52 return MID_OPACITY + Math.sin(phase * Math.PI * 2) * 0.18;
53 }
54
55 const rotation = phase * Math.PI * 2;
56 const spokeA = angularDistance(angle, rotation);
57 const spokeB = angularDistance(angle, rotation + (Math.PI * 2) / 3);
58 const spokeC = angularDistance(angle, rotation + (Math.PI * 4) / 3);
59 const nearestSpoke = Math.min(spokeA, spokeB, spokeC);
60 const spokeGlow = Math.max(0, 1 - nearestSpoke / SPOKE_WIDTH);
61 const outerPulse = 0.5 + 0.5 * Math.sin(phase * Math.PI * 2 - radius * 2.2);
62// … truncated

Facts

Registry
@cellforge
Type
registry:ui
Access
Free
Files written
0
Licence
MIT
First indexed
2026-08-03
Last confirmed
yesterday

Go to the source

cellforge.dev cellforge-dev/cellforge on GitHub Raw registry item This item as JSON

More from @cellforge

All 71 items
Same registry, same kind — the ones you would have found next
ComponentRegistryKindAccessInstallsCommand
All CellForge Loadersall@cellforgeComponentsFreeno deps
Core Spokescell-angle-1@cellforgeComponentsFreeno deps
Column Rakecell-angle-10@cellforgeComponentsFreeno deps
Shelf Descentcell-angle-11@cellforgeComponentsFreeno deps
Skew Driftcell-angle-12@cellforgeComponentsFreeno deps
Serpent Zipcell-angle-13@cellforgeComponentsFreeno deps
Pillar Sweepcell-angle-14@cellforgeComponentsFreeno deps
Tripod Handoffcell-angle-15@cellforgeComponentsFreeno deps
BlockDex

Built by

Kynth Studio

Index

Components
Registries
Method
Open API

Guides

shadcn component libraries
Best shadcn registries
Free shadcn blocks

Reference

Corpus counts
Crawl health
hello@kynth.studio
Privacy
Terms

BlockDex

BlockDex

Built by

Kynth Studio

Index

Components
Registries
Method
Open API

Guides

shadcn component libraries
Best shadcn registries
Free shadcn blocks

Reference

Corpus counts
Crawl health
hello@kynth.studio
Privacy
Terms

BlockDex

BlockDex

Built by

Kynth Studio

Index

Components
Registries
Method
Open API

Guides

shadcn component libraries
Best shadcn registries
Free shadcn blocks

Reference

Corpus counts
Crawl health
hello@kynth.studio
Privacy
Terms

BlockDex