✨ Give us a star on GitHub Help us grow by starring the project and sharing your feedback.

Getting Started

Templates

Mockups

Components

Special Animations

Buttons

Text Animations

Backgrounds

Components

A collection of components that are used to build the landing page of a website.

Universal Compatibility

Works seamlessly with Next.js, React, HTML, Apple, GitHub, OpenAI, and more fits everywhere.

import AnimatedFrameworks from "@/registry/eldoraui/animated-frameworks"

export function AnimatedFrameworksExample() {
  return (
    <AnimatedFrameworks
      cardTitle="Universal Compatibility"
      cardDescription="Works seamlessly with Next.js, React, HTML, Apple, GitHub, OpenAI, and more fits everywhere."
    />
  )
}

3

8

8

0

8

2

Multifactor Authentication

Each user's self-serve multifactor settings are enforced automatically during sign-in.

import ClerkOTP from "@/registry/eldoraui/clerk-otp"

export function ClerkOTPDemo2() {
  return (
    <ClerkOTP
      delay={3500} // Time interval (in ms) after which the OTP animation resets.
      cardTitle="Multifactor Authentication"
      cardDescription="Each user's self-serve multifactor settings are enforced automatically during sign-in."
      whileHover={false} // Normal animation behavior
    />
  )
}

EldoraUI's components make building UIs effortless great work!

"use client"

import FancyTestimonialsSlider from "@/registry/eldoraui/testimonal-slider"

export function TestimonalSliderDemo() {
  const testimonials = [
    {
      img: "https://avatar.vercel.sh/karthik",
      quote: "EldoraUI's components make building UIs effortless great work!",
      name: "Karthik",
      role: "Developer",
    },
    {
      img: "https://avatar.vercel.sh/nick",
      quote:
        "EldoraUI simplifies complex designs with ready-to-use components.",
      name: "Nick",
      role: "Designer",
    },
    {
      img: "https://avatar.vercel.sh/amelia",
      quote: "With EldoraUI, creating responsive UIs is a breeze.",
      name: "Amelia",
      role: "Tester",
    },
  ]
  return (
    <div className="bg-background relative h-[400px] w-full overflow-hidden rounded-lg border sm:h-[500px]">
      <div className="mt-8 flex justify-center px-4 sm:mt-16 sm:px-12">
        <FancyTestimonialsSlider
          testimonials={testimonials}
          autorotateTiming={5000}
        />
      </div>
    </div>
  )
}

Change Log Legacy Versions