Solenoid Valve

An animated SVG diagram of a coil-driven solenoid valve that cycles, pulses, or can be dragged open and shut to show plunger position, flow routing, and the electromagnetic field.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Solenoid Valve to your project and fits it to your theme.

import { SolenoidValve } from "@/components/ui/solenoid-valve";

export default function SolenoidValveDemo() {
  return (
    <div className="flex min-h-[420px] w-full items-center justify-center bg-background p-10">
      <SolenoidValve size="lg" />
    </div>
  );
}