Double stairs preloader

Advanced staircase preloader with dual-direction animations and complex timing. Features double staircase animations that move from both top and bottom with synchronized timing and smooth easing functions for a more complex and engaging preloader experience.

Best Viewed on

Dependencies

Interaction Type

CLI UNAVAILABLE

pro component, try copying the source code from top right corner

const DemoSkiper10 = () => {
  const [showPreloader, setShowPreloader] = useState(true);

  useEffect(() => {
    const timer = setTimeout(() => {
      setShowPreloader(false);
    }, 2500);

    return () => clearTimeout(timer);
  }, []);

  return (
    <main className="relative">
      <AnimatePresence mode="wait">
        {showPreloader && <Preloader_004 />}
      </AnimatePresence>
      <Main />
    </main>
  );
};

Source code

Keep in mind

Most components here are recreations of the best out there. I don't claim to be the original creator. This is my attempt to reverse-engineer, replicate, and often add a few extra features. I've tried to credit everyone, but if I missed something, let me know.

Contact

License & Usage:

• Free to use and modify in both personal and commercial projects.
• Attribution to Skiper UI is required when using the free version.
• No attribution required with Skiper UI Pro.