Backgrounds & motion / CSS
Aurora field
Slow-moving color that gives a quiet page some atmosphere.
Preparing the component workbench…
Backgrounds & motion / CSS
Slow-moving color that gives a quiet page some atmosphere.
SOURCE / REACT · provisional
import AuroraField from "@/components/buildwithme/aurora-field/react";
<AuroraField />// MIT · BuildWithMe-UI contributors. Original implementation.
'use client';
import { useAnimation, type AnimationProps } from './use-animation';
import './base.css';
import './aurora-field.css';
export default function AuroraField({ paused = false }: AnimationProps) {
const { ref, active } = useAnimation(paused);
return (
<div ref={ref} className="bw-demo bw-aurora" data-active={active}>
<div aria-hidden="true" />
</div>
);
}
Install the registry item to receive all 7 files and their declared dependencies. Copying one file may require the other files shown here.