SiNodedotjs

Tech

Animated, copy-ready variants of the SiNodedotjs icon, powered by Motion.

Animations

Click a card to copy its Motion snippet - drop it straight into a "use client" component.

Installation

Animated component. Pulls animated-si-nodedotjs.tsx into your project with every variant above, and installs motion and the icon set for you:

$pnpm dlx shadcn@latest add https://nawalkattel.com.np/r/icon-si-nodedotjs.json

import { AnimatedSiNodedotjs } from "@/components/ui/animated-si-nodedotjs";

export function Example() {
  return <AnimatedSiNodedotjs variant="pulse" className="size-6" />;
}

Icon only. If you just want the glyph, install the set and import it directly:

$pnpm add react-icons

import { SiNodedotjs } from "react-icons/si";

export function Example() {
  return <SiNodedotjs className="size-6" />;
}

Animated usage

Animations use motion - install it with pnpm add motion, then wrap the icon in a motion.span. Each card above copies its own variant; here's the full component:

"use client";

import { motion } from "motion/react";
import { SiNodedotjs } from "react-icons/si";

export function AnimatedSiNodedotjs() {
  return (
    <motion.span
      animate={{ rotate: 360 }}
      transition={{ duration: 1.8, ease: "linear", repeat: Infinity }}
    >
      <SiNodedotjs className="size-6" />
    </motion.span>
  );
}