{
  "name": "atlas-ui",
  "homepage": "https://atlasui.dev",
  "items": [
    {
      "name": "index",
      "dependencies": [
        "motion"
      ],
      "devDependencies": [],
      "registryDependencies": [
        "utils"
      ],
      "files": [],
      "cssVars": {},
      "type": "registry:style"
    },
    {
      "name": "animated-mobile-navbar",
      "title": "Animated Mobile Navbar",
      "description": "A simple animated mobile navbar component.",
      "dependencies": [
        "motion",
        "lucide-react"
      ],
      "registryDependencies": [
        "button"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/animated-mobile-navbar.tsx",
          "type": "registry:component"
        }
      ],
      "type": "registry:component"
    },
    {
      "name": "project-gallery",
      "title": "Project Gallery",
      "description": "A Project Gallery with an interactive modal.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/project-gallery.tsx",
          "type": "registry:component"
        }
      ],
      "type": "registry:component"
    },
    {
      "name": "parallax-sections",
      "title": "Parallax Sections",
      "description": "A simple Parallax effect using Motion.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/parallax-sections.tsx",
          "type": "registry:component"
        }
      ],
      "type": "registry:component"
    },
    {
      "name": "shiny-button",
      "title": "Shiny Button",
      "description": "A shiny button with a sleek animation effect.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "utils"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/shiny-button.tsx",
          "type": "registry:ui"
        }
      ],
      "css": {
        ".radial-gradient": {
          "background": "radial-gradient(circle at 50% 0%, rgba(250, 250, 250, 0.05) 0%, transparent 60%), rgba(15, 15, 15, 1)"
        },
        ".linear-mask": {
          "mask-image": "linear-gradient(-75deg, white calc(var(--x) + 20%), transparent calc(var(--x) + 30%), white calc(var(--x) + 100%))"
        },
        ".linear-overlay": {
          "background-image": "linear-gradient(-75deg, rgba(255,255,255,0.1) calc(var(--x) + 20%), rgba(255,255,255,0.5) calc(var(--x) + 25%), rgba(255,255,255,0.1) calc(var(--x) + 100%))",
          "mask": "linear-gradient(black, black) content-box, linear-gradient(black, black)",
          "mask-composite": "exclude"
        }
      },
      "type": "registry:ui"
    },
    {
      "name": "dot-and-circle-mouse-trailer",
      "title": "Dot And Circle Mouse Trailer",
      "description": "A simple Lazy Dot and Circle Mouse Trailer",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/dot-and-circle-mouse-trailer.tsx",
          "type": "registry:component"
        }
      ],
      "type": "registry:component"
    },
    {
      "name": "blob-mouse-trailer",
      "title": "Blob Mouse Trailer",
      "description": "A simple Lazy Blob Mouse Trailer",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/blob-mouse-trailer.tsx",
          "type": "registry:component"
        }
      ],
      "type": "registry:component"
    },
    {
      "name": "blend-mouse-trailer",
      "title": "Blend Mouse Trailer",
      "description": "A simple Lazy Mouse Trailer which blends with the content on hover.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/blend-mouse-trailer.tsx",
          "type": "registry:component"
        }
      ],
      "type": "registry:component"
    },
    {
      "name": "hacker-text",
      "title": "Hacker Text",
      "description": "A text animation that scrambles letters before revealing the final text.",
      "dependencies": [],
      "registryDependencies": [
        "utils"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/hacker-text.tsx",
          "type": "registry:component"
        }
      ],
      "type": "registry:component"
    },
    {
      "name": "scroll-based-text-reveal",
      "title": "Scroll Based Text Reveal",
      "description": "A text reveal effect which animates the opacity of the text as you scroll.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/scroll-based-text-reveal.tsx",
          "type": "registry:component"
        }
      ],
      "type": "registry:component"
    },
    {
      "name": "scroll-based-word-reveal",
      "title": "Scroll Based Word Reveal",
      "description": "A text reveal effect which progressively reveals text word by word as you scroll.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/scroll-based-word-reveal.tsx",
          "type": "registry:component"
        }
      ],
      "type": "registry:component"
    },
    {
      "name": "scroll-based-character-reveal",
      "title": "Scroll Based Character Reveal",
      "description": "A text reveal effect which progressively reveals text character by character as you scroll.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/scroll-based-character-reveal.tsx",
          "type": "registry:component"
        }
      ],
      "type": "registry:component"
    },
    {
      "name": "reveal-effect",
      "title": "Reveal Effect",
      "description": "Animates content into view with a vertical slide, blur fade-in, and clipping reveal effect.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/reveal-effect.tsx",
          "type": "registry:component"
        }
      ],
      "type": "registry:component"
    },
    {
      "name": "loki-text-effect",
      "title": "Loki Text Effect",
      "description": "The iconic text animation from the Loki series intro.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "utils"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/loki-text-effect.tsx",
          "type": "registry:component"
        },
        {
          "path": "registry/fonts/font.ts",
          "type": "registry:file",
          "target": "~/fonts/font.ts"
        },
        {
          "path": "registry/fonts/fontOne.woff2",
          "type": "registry:file",
          "target": "app/fonts/fontOne.woff2"
        },
        {
          "path": "registry/fonts/fontTwo.woff2",
          "type": "registry:file",
          "target": "app/fonts/fontTwo.woff2"
        },
        {
          "path": "registry/fonts/fontThree.woff2",
          "type": "registry:file",
          "target": "app/fonts/fontThree.woff2"
        },
        {
          "path": "registry/fonts/fontFour.woff2",
          "type": "registry:file",
          "target": "app/fonts/fontFour.woff2"
        },
        {
          "path": "registry/fonts/fontFive.woff2",
          "type": "registry:file",
          "target": "app/fonts/fontFive.woff2"
        },
        {
          "path": "registry/fonts/fontSix.woff2",
          "type": "registry:file",
          "target": "app/fonts/fontSix.woff2"
        },
        {
          "path": "registry/fonts/fontSeven.woff2",
          "type": "registry:file",
          "target": "app/fonts/fontSeven.woff2"
        }
      ],
      "type": "registry:component"
    },
    {
      "name": "box-reveal",
      "title": "Box Reveal",
      "description": "A smooth reveal animation that slides a colored overlay away to introduce content as it enters the viewport.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "utils"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/box-reveal.tsx",
          "type": "registry:component"
        }
      ],
      "type": "registry:component"
    },
    {
      "name": "notch-nav",
      "title": "Notch Nav",
      "description": "A Notch style trigger that reveals the navigation menu from above.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "utils"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/notch-nav.tsx",
          "type": "registry:component"
        }
      ],
      "type": "registry:component"
    },
    {
      "name": "morph-navbar",
      "title": "Morph Navbar",
      "description": "A polished navigation bar with a fluid, morphing pill that tracks the active link and hover state.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "utils"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/morph-navbar.tsx",
          "type": "registry:component"
        }
      ],
      "type": "registry:component"
    },
    {
      "name": "cascade-text",
      "title": "Cascade Text",
      "description": "A smooth line-by-line text reveal animation.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/cascade-text.tsx",
          "type": "registry:component"
        }
      ],
      "type": "registry:component"
    },
    {
      "name": "letter-swap",
      "title": "Letter Swap",
      "description": "A text animation that swaps the letters vertically on hover.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "utils"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/letter-swap.tsx",
          "type": "registry:component"
        }
      ],
      "type": "registry:component"
    },
    {
      "name": "warp-slider",
      "title": "Warp Slider",
      "description": "A smooth, infinite slider with dynamic warp distortion and momentum based scrolling.",
      "dependencies": [
        "three"
      ],
      "devDependencies": [
        "@types/three"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/warp-slider.tsx",
          "type": "registry:component"
        }
      ],
      "type": "registry:component"
    },
    {
      "name": "fancy-theme-toggle",
      "title": "Fancy Theme Toggle",
      "description": "Theme Toggle from the classic Designer vs Developer meme.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "utils"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/fancy-theme-toggle.tsx",
          "type": "registry:component"
        }
      ],
      "type": "registry:component"
    },
    {
      "name": "magnetic-hover",
      "title": "Magnetic Hover",
      "description": "A smooth magnetic hover interaction that subtly pulls elements toward the with using spring based motion animations.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/magnetic-hover.tsx",
          "type": "registry:component"
        }
      ],
      "type": "registry:component"
    },
    {
      "name": "typewriter",
      "title": "Typewriter",
      "description": "A typewriter component that cycles through text with a synced flashing highlight animation.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/react/atlasui/typewriter.tsx",
          "type": "registry:component"
        }
      ],
      "type": "registry:component"
    },
    {
      "name": "animated-mobile-navbar-demo",
      "title": "Animated Mobile Navbar Demo",
      "description": "Example showcasing the Animated Mobile Navbar component.",
      "registryDependencies": [
        "https://atlasui.dev/r/animated-mobile-navbar.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/animated-mobile-navbar-demo.tsx",
          "type": "registry:example"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "animated-mobile-navbar-side-example",
      "title": "Animated Mobile Navbar Side Example",
      "description": "Example showcasing the Mobile Navbar emerging from the side.",
      "registryDependencies": [
        "https://atlasui.dev/r/animated-mobile-navbar.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/animated-mobile-navbar-side-example.tsx",
          "type": "registry:example"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "project-gallery-demo",
      "title": "Project Gallery Demo",
      "description": "Example of Project Gallery with an interactive modal.",
      "registryDependencies": [
        "https://atlasui.dev/r/project-gallery.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/project-gallery-demo.tsx",
          "type": "registry:example",
          "target": "components/project-gallery-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "parallax-sections-demo",
      "title": "Parallax Sections Demo",
      "description": "Example of Parallax Sections component.",
      "registryDependencies": [
        "https://atlasui.dev/r/parallax-sections.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/parallax-sections-demo.tsx",
          "type": "registry:example",
          "target": "components/parallax-sections-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "shiny-button-demo",
      "title": "Shiny Button Demo",
      "description": "Example of Shiny Button with a sleek animation effect.",
      "registryDependencies": [
        "https://atlasui.dev/r/shiny-button.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/shiny-button-demo.tsx",
          "type": "registry:example",
          "target": "components/shiny-button-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "dot-and-circle-mouse-trailer-demo",
      "title": "Dot and Circle Mouse Trailer Demo",
      "description": "Example showing the lazy dot and circle that follows the mouse cursor.",
      "registryDependencies": [
        "https://atlasui.dev/r/dot-and-circle-mouse-trailer.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/dot-and-circle-mouse-trailer-demo.tsx",
          "type": "registry:example",
          "target": "components/dot-and-circle-mouse-trailer-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "blob-mouse-trailer-demo",
      "title": "Blob Mouse Trailer Demo",
      "description": "Example showing the lazy blob that follows the mouse cursor.",
      "registryDependencies": [
        "https://atlasui.dev/r/blob-mouse-trailer.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/blob-mouse-trailer-demo.tsx",
          "type": "registry:example",
          "target": "components/blob-mouse-trailer-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "blend-mouse-trailer-demo",
      "title": "Blend Mouse Trailer Demo",
      "description": "Example showing the lazy mouse trailer which blends with the content on hover.",
      "registryDependencies": [
        "https://atlasui.dev/r/blend-mouse-trailer.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/blend-mouse-trailer-demo.tsx",
          "type": "registry:example",
          "target": "components/blend-mouse-trailer-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "hacker-text-demo",
      "title": "Hacker Text Demo",
      "description": "Example showcasing text animation that scrambles letters before revealing the final text",
      "registryDependencies": [
        "https://atlasui.dev/r/hacker-text.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/hacker-text-demo.tsx",
          "type": "registry:example",
          "target": "components/hacker-text-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "scroll-based-text-reveal-demo",
      "title": "Scroll Based Text Reveal Demo",
      "description": "Example showcasing a text reveal effect which animates the opacity of the text as you scroll.",
      "registryDependencies": [
        "https://atlasui.dev/r/scroll-based-text-reveal.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/scroll-based-text-reveal-demo.tsx",
          "type": "registry:example",
          "target": "components/scroll-based-text-reveal-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "scroll-based-word-reveal-demo",
      "title": "Scroll Based Word Reveal Demo",
      "description": "Example showcasing a word reveal effect which animates the opacity of the word as you scroll.",
      "registryDependencies": [
        "https://atlasui.dev/r/scroll-based-word-reveal.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/scroll-based-word-reveal-demo.tsx",
          "type": "registry:example",
          "target": "components/scroll-based-word-reveal-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "scroll-based-character-reveal-demo",
      "title": "Scroll Based Character Reveal Demo",
      "description": "Example showcasing a character reveal effect which animates the opacity of the character as you scroll.",
      "registryDependencies": [
        "https://atlasui.dev/r/scroll-based-character-reveal.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/scroll-based-character-reveal-demo.tsx",
          "type": "registry:example",
          "target": "components/scroll-based-character-reveal-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "reveal-effect-demo",
      "title": "Reveal Effect Demo",
      "description": "Example of Reveal Effect with a vertical slide, blur fade-in, and clipping reveal effect.",
      "registryDependencies": [
        "https://atlasui.dev/r/reveal-effect.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/reveal-effect-demo.tsx",
          "type": "registry:example",
          "target": "components/reveal-effect-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "reveal-effect-speed-example",
      "title": "Reveal Effect Example 1",
      "description": "Example of Reveal Effect with a custom speed.",
      "registryDependencies": [
        "https://atlasui.dev/r/reveal-effect.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/reveal-effect-speed-example.tsx",
          "type": "registry:example",
          "target": "components/reveal-effect-speed-example.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "reveal-effect-delay-example",
      "title": "Reveal Effect Example 2",
      "description": "Example of Reveal Effect with a custom delay.",
      "registryDependencies": [
        "https://atlasui.dev/r/reveal-effect.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/reveal-effect-delay-example.tsx",
          "type": "registry:example",
          "target": "components/reveal-effect-delay-example.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "reveal-effect-translate-y-example",
      "title": "Reveal Effect Example 3",
      "description": "Example of Reveal Effect with a custom translate-y.",
      "registryDependencies": [
        "https://atlasui.dev/r/reveal-effect.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/reveal-effect-translate-y-example.tsx",
          "type": "registry:example",
          "target": "components/reveal-effect-translate-y-example.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "loki-text-effect-demo",
      "title": "Loki Text Effect Demo",
      "description": "Example showcasing the iconic animation from the Loki series intro.",
      "registryDependencies": [
        "https://atlasui.dev/r/loki-text-effect.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/loki-text-effect-demo.tsx",
          "type": "registry:example",
          "target": "components/loki-text-effect-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "box-reveal-demo",
      "title": "Box Reveal Demo",
      "description": "Example of Box Reveal that has a smooth reveal animation that slides a colored overlay away to introduce content as it enters the viewport.",
      "registryDependencies": [
        "https://atlasui.dev/r/box-reveal.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/box-reveal-demo.tsx",
          "type": "registry:example",
          "target": "components/box-reveal-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "notch-nav-demo",
      "title": "Notch Nav Demo",
      "description": "Example of Notch style trigger that reveals the navigation menu from above.",
      "registryDependencies": [
        "https://atlasui.dev/r/notch-nav.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/notch-nav-demo.tsx",
          "type": "registry:example",
          "target": "components/notch-nav-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "morph-navbar-demo",
      "title": "Morph Navbar Demo",
      "description": "Example of Morph Navbar with a fluid, morphing pill that tracks the active link and hover state.",
      "registryDependencies": [
        "https://atlasui.dev/r/morph-navbar.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/morph-navbar-demo.tsx",
          "type": "registry:example",
          "target": "components/morph-navbar-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "cascade-text-demo",
      "title": "Cascade Text Demo",
      "description": "Example of Cascade Text with a smooth line-by-line reveal.",
      "registryDependencies": [
        "https://atlasui.dev/r/cascade-text.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/cascade-text-demo.tsx",
          "type": "registry:example",
          "target": "components/cascade-text-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "letter-swap-demo",
      "title": "Letter Swap Demo",
      "description": "Example of Letter Swap that swaps the letters vertically on hover.",
      "registryDependencies": [
        "https://atlasui.dev/r/letter-swap.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/letter-swap-demo.tsx",
          "type": "registry:example",
          "target": "components/letter-swap-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "warp-slider-demo",
      "title": "Warp Slider Demo",
      "description": "Example of a smooth, infinite slider with dynamic warp distortion and momentum based scrolling.",
      "registryDependencies": [
        "https://atlasui.dev/r/warp-slider.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/warp-slider-demo.tsx",
          "type": "registry:example",
          "target": "components/warp-slider-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "warp-slider-horizontal-demo",
      "title": "Warp Slider Horizontal Demo",
      "description": "Example of a smooth, infinite horizontal slider with dynamic warp distortion and momentum based scrolling.",
      "registryDependencies": [
        "https://atlasui.dev/r/warp-slider.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/warp-slider-horizontal-demo.tsx",
          "type": "registry:example",
          "target": "components/warp-slider-horizontal-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "fancy-theme-toggle-demo",
      "title": "Fancy Theme Toggle Demo",
      "description": "Example of Theme Toggle from the classic Designer vs Developer meme.",
      "registryDependencies": [
        "https://atlasui.dev/r/fancy-theme-toggle.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/fancy-theme-toggle-demo.tsx",
          "type": "registry:example",
          "target": "components/fancy-theme-toggle-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "magnetic-hover-demo",
      "title": "Magnetic Hover Demo",
      "description": "Example of a smooth magnetic hover interaction that subtly pulls elements toward the with using spring based motion animations.",
      "registryDependencies": [
        "https://atlasui.dev/r/magnetic-hover.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/magnetic-hover-demo.tsx",
          "type": "registry:example",
          "target": "components/magnetic-hover-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "typewriter-demo",
      "title": "Typewriter Demo",
      "description": "Example of typewriter component that cycles through text with a synced flashing highlight animation.",
      "registryDependencies": [
        "https://atlasui.dev/r/typewriter.json"
      ],
      "files": [
        {
          "path": "registry/react/examples/typewriter-demo.tsx",
          "type": "registry:example",
          "target": "components/typewriter-demo.tsx"
        }
      ],
      "type": "registry:example"
    },
    {
      "name": "animated-mobile-navbar-html",
      "title": "Animated Mobile Navbar",
      "description": "A simple animated mobile navbar component in HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [],
      "files": [
        {
          "path": "registry/html/atlasui/animated-mobile-navbar/index.html",
          "type": "registry:file",
          "target": "~/animated-mobile-navbar/index.html"
        },
        {
          "path": "registry/html/atlasui/animated-mobile-navbar/style.css",
          "type": "registry:file",
          "target": "~/animated-mobile-navbar/style.css"
        },
        {
          "path": "registry/html/atlasui/animated-mobile-navbar/script.js",
          "type": "registry:file",
          "target": "~/animated-mobile-navbar/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "project-gallery-html",
      "title": "Project Gallery",
      "description": "A Project Gallery with an interactive modal using HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/html/atlasui/project-gallery/index.html",
          "type": "registry:file",
          "target": "~/project-gallery/index.html"
        },
        {
          "path": "registry/html/atlasui/project-gallery/style.css",
          "type": "registry:file",
          "target": "~/project-gallery/style.css"
        },
        {
          "path": "registry/html/atlasui/project-gallery/script.js",
          "type": "registry:file",
          "target": "~/project-gallery/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "parallax-sections-html",
      "title": "Parallax Sections",
      "description": "A simple Parallax effect using HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/html/atlasui/parallax-sections/index.html",
          "type": "registry:file",
          "target": "~/parallax-sections/index.html"
        },
        {
          "path": "registry/html/atlasui/parallax-sections/style.css",
          "type": "registry:file",
          "target": "~/parallax-sections/style.css"
        },
        {
          "path": "registry/html/atlasui/parallax-sections/script.js",
          "type": "registry:file",
          "target": "~/parallax-sections/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "shiny-button-html",
      "title": "Shiny Button",
      "description": "A shiny button with a sleek animation effect using HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/html/atlasui/shiny-button/index.html",
          "type": "registry:file",
          "target": "~/shiny-button/index.html"
        },
        {
          "path": "registry/html/atlasui/shiny-button/style.css",
          "type": "registry:file",
          "target": "~/shiny-button/style.css"
        },
        {
          "path": "registry/html/atlasui/shiny-button/script.js",
          "type": "registry:file",
          "target": "~/shiny-button/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "dot-and-circle-mouse-trailer-html",
      "title": "Dot And Circle Mouse Trailer",
      "description": "A simple Lazy Dot and Circle Mouse Trailer using HTML, CSS and JavaScript.",
      "dependencies": [],
      "files": [
        {
          "path": "registry/html/atlasui/dot-and-circle-mouse-trailer/index.html",
          "type": "registry:file",
          "target": "~/dot-and-circle-mouse-trailer/index.html"
        },
        {
          "path": "registry/html/atlasui/dot-and-circle-mouse-trailer/style.css",
          "type": "registry:file",
          "target": "~/dot-and-circle-mouse-trailer/style.css"
        },
        {
          "path": "registry/html/atlasui/dot-and-circle-mouse-trailer/script.js",
          "type": "registry:file",
          "target": "~/dot-and-circle-mouse-trailer/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "blob-mouse-trailer-html",
      "title": "Blob Mouse Trailer",
      "description": "A simple Lazy Blob Mouse Trailer using HTML, CSS and JavaScript.",
      "dependencies": [],
      "files": [
        {
          "path": "registry/html/atlasui/blob-mouse-trailer/index.html",
          "type": "registry:file",
          "target": "~/blob-mouse-trailer/index.html"
        },
        {
          "path": "registry/html/atlasui/blob-mouse-trailer/style.css",
          "type": "registry:file",
          "target": "~/blob-mouse-trailer/style.css"
        },
        {
          "path": "registry/html/atlasui/blob-mouse-trailer/script.js",
          "type": "registry:file",
          "target": "~/blob-mouse-trailer/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "blend-mouse-trailer-html",
      "title": "Blend Mouse Trailer",
      "description": "A simple Lazy Mouse Trailer which blends with the content on hover using HTML, CSS and JavaScript.",
      "dependencies": [],
      "files": [
        {
          "path": "registry/html/atlasui/blend-mouse-trailer/index.html",
          "type": "registry:file",
          "target": "~/blend-mouse-trailer/index.html"
        },
        {
          "path": "registry/html/atlasui/blend-mouse-trailer/style.css",
          "type": "registry:file",
          "target": "~/blend-mouse-trailer/style.css"
        },
        {
          "path": "registry/html/atlasui/blend-mouse-trailer/script.js",
          "type": "registry:file",
          "target": "~/blend-mouse-trailer/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "hacker-text-html",
      "title": "Hacker Text",
      "description": "A text animation that scrambles letters before revealing the final text using HTML, CSS and JavaScript.",
      "dependencies": [],
      "files": [
        {
          "path": "registry/html/atlasui/hacker-text/index.html",
          "type": "registry:file",
          "target": "~/hacker-text/index.html"
        },
        {
          "path": "registry/html/atlasui/hacker-text/style.css",
          "type": "registry:file",
          "target": "~/hacker-text/style.css"
        },
        {
          "path": "registry/html/atlasui/hacker-text/script.js",
          "type": "registry:file",
          "target": "~/hacker-text/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "scroll-based-text-reveal-html",
      "title": "Scroll Based Text Reveal",
      "description": "A text reveal effect which animates the opacity of the text as you scroll using HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/html/atlasui/scroll-based-text-reveal/index.html",
          "type": "registry:file",
          "target": "~/scroll-based-text-reveal/index.html"
        },
        {
          "path": "registry/html/atlasui/scroll-based-text-reveal/style.css",
          "type": "registry:file",
          "target": "~/scroll-based-text-reveal/style.css"
        },
        {
          "path": "registry/html/atlasui/scroll-based-text-reveal/script.js",
          "type": "registry:file",
          "target": "~/scroll-based-text-reveal/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "scroll-based-word-reveal-html",
      "title": "Scroll Based Word Reveal",
      "description": "A text reveal effect which progressively reveals text word by word as you scroll using HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/html/atlasui/scroll-based-word-reveal/index.html",
          "type": "registry:file",
          "target": "~/scroll-based-word-reveal/index.html"
        },
        {
          "path": "registry/html/atlasui/scroll-based-word-reveal/style.css",
          "type": "registry:file",
          "target": "~/scroll-based-word-reveal/style.css"
        },
        {
          "path": "registry/html/atlasui/scroll-based-word-reveal/script.js",
          "type": "registry:file",
          "target": "~/scroll-based-word-reveal/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "scroll-based-character-reveal-html",
      "title": "Scroll Based Character Reveal",
      "description": "A text reveal effect which progressively reveals text character by character as you scroll using HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/html/atlasui/scroll-based-character-reveal/index.html",
          "type": "registry:file",
          "target": "~/scroll-based-character-reveal/index.html"
        },
        {
          "path": "registry/html/atlasui/scroll-based-character-reveal/style.css",
          "type": "registry:file",
          "target": "~/scroll-based-character-reveal/style.css"
        },
        {
          "path": "registry/html/atlasui/scroll-based-character-reveal/script.js",
          "type": "registry:file",
          "target": "~/scroll-based-character-reveal/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "reveal-effect-html",
      "title": "Reveal Effect",
      "description": "Animates content into view with a vertical slide, blur fade-in, and clipping reveal effect using HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/html/atlasui/reveal-effect/index.html",
          "type": "registry:file",
          "target": "~/reveal-effect/index.html"
        },
        {
          "path": "registry/html/atlasui/reveal-effect/style.css",
          "type": "registry:file",
          "target": "~/reveal-effect/style.css"
        },
        {
          "path": "registry/html/atlasui/reveal-effect/script.js",
          "type": "registry:file",
          "target": "~/reveal-effect/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "loki-text-effect-html",
      "title": "Loki Text Effect",
      "description": "The iconic text animation from the Loki series intro using HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/html/atlasui/loki-text-effect/index.html",
          "type": "registry:file",
          "target": "~/loki-text-effect/index.html"
        },
        {
          "path": "registry/html/atlasui/loki-text-effect/style.css",
          "type": "registry:file",
          "target": "~/loki-text-effect/style.css"
        },
        {
          "path": "registry/html/atlasui/loki-text-effect/script.js",
          "type": "registry:file",
          "target": "~/loki-text-effect/script.js"
        },
        {
          "path": "registry/fonts/fontOne.woff2",
          "type": "registry:file",
          "target": "~/fonts/fontOne.woff2"
        },
        {
          "path": "registry/fonts/fontTwo.woff2",
          "type": "registry:file",
          "target": "~/fonts/fontTwo.woff2"
        },
        {
          "path": "registry/fonts/fontThree.woff2",
          "type": "registry:file",
          "target": "~/fonts/fontThree.woff2"
        },
        {
          "path": "registry/fonts/fontFour.woff2",
          "type": "registry:file",
          "target": "~/fonts/fontFour.woff2"
        },
        {
          "path": "registry/fonts/fontFive.woff2",
          "type": "registry:file",
          "target": "~/fonts/fontFive.woff2"
        },
        {
          "path": "registry/fonts/fontSix.woff2",
          "type": "registry:file",
          "target": "~/fonts/fontSix.woff2"
        },
        {
          "path": "registry/fonts/fontSeven.woff2",
          "type": "registry:file",
          "target": "~/fonts/fontSeven.woff2"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "box-reveal-html",
      "title": "Box Reveal",
      "description": "A smooth reveal animation that slides a colored overlay away to introduce content as it enters the viewport.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/html/atlasui/box-reveal/index.html",
          "type": "registry:file",
          "target": "~/box-reveal/index.html"
        },
        {
          "path": "registry/html/atlasui/box-reveal/style.css",
          "type": "registry:file",
          "target": "~/box-reveal/style.css"
        },
        {
          "path": "registry/html/atlasui/box-reveal/script.js",
          "type": "registry:file",
          "target": "~/box-reveal/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "notch-nav-html",
      "title": "Notch Nav",
      "description": "A Notch style trigger that reveals the navigation menu from above built with HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/html/atlasui/notch-nav/index.html",
          "type": "registry:file",
          "target": "~/notch-nav/index.html"
        },
        {
          "path": "registry/html/atlasui/notch-nav/style.css",
          "type": "registry:file",
          "target": "~/notch-nav/style.css"
        },
        {
          "path": "registry/html/atlasui/notch-nav/script.js",
          "type": "registry:file",
          "target": "~/notch-nav/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "morph-navbar-html",
      "title": "Morph Navbar",
      "description": "A polished navigation bar with a fluid, morphing pill that tracks the active link and hover state built with HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/html/atlasui/morph-navbar/index.html",
          "type": "registry:file",
          "target": "~/morph-navbar/index.html"
        },
        {
          "path": "registry/html/atlasui/morph-navbar/style.css",
          "type": "registry:file",
          "target": "~/morph-navbar/style.css"
        },
        {
          "path": "registry/html/atlasui/morph-navbar/script.js",
          "type": "registry:file",
          "target": "~/morph-navbar/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "cascade-text-html",
      "title": "Cascade Text",
      "description": "A smooth line-by-line text reveal animation built with HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/html/atlasui/cascade-text/index.html",
          "type": "registry:file",
          "target": "~/cascade-text/index.html"
        },
        {
          "path": "registry/html/atlasui/cascade-text/style.css",
          "type": "registry:file",
          "target": "~/cascade-text/style.css"
        },
        {
          "path": "registry/html/atlasui/cascade-text/script.js",
          "type": "registry:file",
          "target": "~/cascade-text/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "letter-swap-html",
      "title": "Letter Swap",
      "description": "A text animation that swaps the letters vertically on hover, built with HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/html/atlasui/letter-swap/index.html",
          "type": "registry:file",
          "target": "~/letter-swap/index.html"
        },
        {
          "path": "registry/html/atlasui/letter-swap/style.css",
          "type": "registry:file",
          "target": "~/letter-swap/style.css"
        },
        {
          "path": "registry/html/atlasui/letter-swap/script.js",
          "type": "registry:file",
          "target": "~/letter-swap/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "warp-slider-html",
      "title": "Warp Slider",
      "description": "A smooth, infinite slider with dynamic warp distortion and momentum based scrolling built with HTML, CSS, JavaScript and Three.js.",
      "dependencies": [
        "three"
      ],
      "files": [
        {
          "path": "registry/html/atlasui/warp-slider/index.html",
          "type": "registry:file",
          "target": "~/warp-slider/index.html"
        },
        {
          "path": "registry/html/atlasui/warp-slider/style.css",
          "type": "registry:file",
          "target": "~/warp-slider/style.css"
        },
        {
          "path": "registry/html/atlasui/warp-slider/script.js",
          "type": "registry:file",
          "target": "~/warp-slider/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "fancy-theme-toggle-html",
      "title": "Fancy Theme Toggle",
      "description": "Theme Toggle from the classic Designer vs Developer meme, built with HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion",
        "lucide"
      ],
      "files": [
        {
          "path": "registry/html/atlasui/fancy-theme-toggle/index.html",
          "type": "registry:file",
          "target": "~/fancy-theme-toggle/index.html"
        },
        {
          "path": "registry/html/atlasui/fancy-theme-toggle/style.css",
          "type": "registry:file",
          "target": "~/fancy-theme-toggle/style.css"
        },
        {
          "path": "registry/html/atlasui/fancy-theme-toggle/script.js",
          "type": "registry:file",
          "target": "~/fancy-theme-toggle/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "magnetic-hover-html",
      "title": "Magnetic Hover",
      "description": "A smooth magnetic hover interaction that subtly pulls elements toward the with using spring based motion animations, built with HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/html/atlasui/magnetic-hover/index.html",
          "type": "registry:file",
          "target": "~/magnetic-hover/index.html"
        },
        {
          "path": "registry/html/atlasui/magnetic-hover/style.css",
          "type": "registry:file",
          "target": "~/magnetic-hover/style.css"
        },
        {
          "path": "registry/html/atlasui/magnetic-hover/script.js",
          "type": "registry:file",
          "target": "~/magnetic-hover/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "typewriter-html",
      "title": "Typewriter",
      "description": "A typewriter component that cycles through text with a synced flashing highlight animation built with HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/html/atlasui/typewriter/index.html",
          "type": "registry:file",
          "target": "~/typewriter/index.html"
        },
        {
          "path": "registry/html/atlasui/typewriter/style.css",
          "type": "registry:file",
          "target": "~/typewriter/style.css"
        },
        {
          "path": "registry/html/atlasui/typewriter/script.js",
          "type": "registry:file",
          "target": "~/typewriter/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:file"
    },
    {
      "name": "animated-mobile-navbar-html-demo",
      "title": "Animated Mobile Navbar",
      "description": "Example showcasing the Animated Mobile Navbar component in HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "https://atlasui.dev/r/animated-mobile-navbar-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/animated-mobile-navbar-html-demo/index.html",
          "type": "registry:file",
          "target": "~/animated-mobile-navbar/index.html"
        },
        {
          "path": "registry/html/examples/animated-mobile-navbar-html-demo/style.css",
          "type": "registry:file",
          "target": "~/animated-mobile-navbar/style.css"
        },
        {
          "path": "registry/html/examples/animated-mobile-navbar-html-demo/script.js",
          "type": "registry:file",
          "target": "~/animated-mobile-navbar/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "project-gallery-html-demo",
      "title": "Project Gallery",
      "description": "Example showcasing the Project Gallery component with an interactive modal using HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "https://atlasui.dev/r/project-gallery-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/project-gallery-html-demo/index.html",
          "type": "registry:file",
          "target": "~/project-gallery/index.html"
        },
        {
          "path": "registry/html/examples/project-gallery-html-demo/style.css",
          "type": "registry:file",
          "target": "~/project-gallery/style.css"
        },
        {
          "path": "registry/html/examples/project-gallery-html-demo/script.js",
          "type": "registry:file",
          "target": "~/project-gallery/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "parallax-sections-html-demo",
      "title": "Parallax Sections",
      "description": "Example of Parallax Sections component using HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "https://atlasui.dev/r/parallax-sections-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/parallax-sections-html-demo/index.html",
          "type": "registry:file",
          "target": "~/parallax-sections/index.html"
        },
        {
          "path": "registry/html/examples/parallax-sections-html-demo/style.css",
          "type": "registry:file",
          "target": "~/parallax-sections/style.css"
        },
        {
          "path": "registry/html/examples/parallax-sections-html-demo/script.js",
          "type": "registry:file",
          "target": "~/parallax-sections/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "shiny-button-html-demo",
      "title": "Shiny Button",
      "description": "Example of Shiny Button with a sleek animation effect using HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "https://atlasui.dev/r/shiny-button-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/shiny-button-html-demo/index.html",
          "type": "registry:file",
          "target": "~/shiny-button/index.html"
        },
        {
          "path": "registry/html/examples/shiny-button-html-demo/style.css",
          "type": "registry:file",
          "target": "~/shiny-button/style.css"
        },
        {
          "path": "registry/html/examples/shiny-button-html-demo/script.js",
          "type": "registry:file",
          "target": "~/shiny-button/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "dot-and-circle-mouse-trailer-html-demo",
      "title": "Dot And Circle Mouse Trailer",
      "description": "Example of Dot And Circle Mouse Trailer using HTML, CSS and JavaScript.",
      "dependencies": [],
      "registryDependencies": [
        "https://atlasui.dev/r/dot-and-circle-mouse-trailer-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/dot-and-circle-mouse-trailer-html-demo/index.html",
          "type": "registry:file",
          "target": "~/dot-and-circle-mouse-trailer/index.html"
        },
        {
          "path": "registry/html/examples/dot-and-circle-mouse-trailer-html-demo/style.css",
          "type": "registry:file",
          "target": "~/dot-and-circle-mouse-trailer/style.css"
        },
        {
          "path": "registry/html/examples/dot-and-circle-mouse-trailer-html-demo/script.js",
          "type": "registry:file",
          "target": "~/dot-and-circle-mouse-trailer/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "blob-mouse-trailer-html-demo",
      "title": "Blob Mouse Trailer",
      "description": "Example of Blob Mouse Trailer using HTML, CSS and JavaScript.",
      "dependencies": [],
      "registryDependencies": [
        "https://atlasui.dev/r/blob-mouse-trailer-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/blob-mouse-trailer-html-demo/index.html",
          "type": "registry:file",
          "target": "~/blob-mouse-trailer/index.html"
        },
        {
          "path": "registry/html/examples/blob-mouse-trailer-html-demo/style.css",
          "type": "registry:file",
          "target": "~/blob-mouse-trailer/style.css"
        },
        {
          "path": "registry/html/examples/blob-mouse-trailer-html-demo/script.js",
          "type": "registry:file",
          "target": "~/blob-mouse-trailer/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "blend-mouse-trailer-html-demo",
      "title": "Blend Mouse Trailer",
      "description": "Example of Blend Mouse Trailer which blends with the content on hover using HTML, CSS and JavaScript.",
      "dependencies": [],
      "registryDependencies": [
        "https://atlasui.dev/r/blend-mouse-trailer-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/blend-mouse-trailer-html-demo/index.html",
          "type": "registry:file",
          "target": "~/blend-mouse-trailer/index.html"
        },
        {
          "path": "registry/html/examples/blend-mouse-trailer-html-demo/style.css",
          "type": "registry:file",
          "target": "~/blend-mouse-trailer/style.css"
        },
        {
          "path": "registry/html/examples/blend-mouse-trailer-html-demo/script.js",
          "type": "registry:file",
          "target": "~/blend-mouse-trailer/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "hacker-text-html-demo",
      "title": "Hacker Text",
      "description": "Example of text animation that scrambles letters before revealing the final text using HTML, CSS and JavaScript.",
      "dependencies": [],
      "registryDependencies": [
        "https://atlasui.dev/r/hacker-text-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/hacker-text-html-demo/index.html",
          "type": "registry:file",
          "target": "~/hacker-text/index.html"
        },
        {
          "path": "registry/html/examples/hacker-text-html-demo/style.css",
          "type": "registry:file",
          "target": "~/hacker-text/style.css"
        },
        {
          "path": "registry/html/examples/hacker-text-html-demo/script.js",
          "type": "registry:file",
          "target": "~/hacker-text/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "scroll-based-text-reveal-html-demo",
      "title": "Scroll Based Text Reveal",
      "description": "Example of text reveal effect which animates the opacity of the text as you scroll using HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "https://atlasui.dev/r/scroll-based-text-reveal-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/scroll-based-text-reveal-html-demo/index.html",
          "type": "registry:file",
          "target": "~/scroll-based-text-reveal/index.html"
        },
        {
          "path": "registry/html/examples/scroll-based-text-reveal-html-demo/style.css",
          "type": "registry:file",
          "target": "~/scroll-based-text-reveal/style.css"
        },
        {
          "path": "registry/html/examples/scroll-based-text-reveal-html-demo/script.js",
          "type": "registry:file",
          "target": "~/scroll-based-text-reveal/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "scroll-based-word-reveal-html-demo",
      "title": "Scroll Based Word Reveal",
      "description": "Example of text reveal effect which progressively reveals text word by word as you scroll using HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "https://atlasui.dev/r/scroll-based-word-reveal-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/scroll-based-word-reveal-html-demo/index.html",
          "type": "registry:file",
          "target": "~/scroll-based-word-reveal/index.html"
        },
        {
          "path": "registry/html/examples/scroll-based-word-reveal-html-demo/style.css",
          "type": "registry:file",
          "target": "~/scroll-based-word-reveal/style.css"
        },
        {
          "path": "registry/html/examples/scroll-based-word-reveal-html-demo/script.js",
          "type": "registry:file",
          "target": "~/scroll-based-word-reveal/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "scroll-based-character-reveal-html-demo",
      "title": "Scroll Based Character Reveal",
      "description": "Example of text reveal effect which progressively reveals text character by character as you scroll using HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "https://atlasui.dev/r/scroll-based-character-reveal-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/scroll-based-character-reveal-html-demo/index.html",
          "type": "registry:file",
          "target": "~/scroll-based-character-reveal/index.html"
        },
        {
          "path": "registry/html/examples/scroll-based-character-reveal-html-demo/style.css",
          "type": "registry:file",
          "target": "~/scroll-based-character-reveal/style.css"
        },
        {
          "path": "registry/html/examples/scroll-based-character-reveal-html-demo/script.js",
          "type": "registry:file",
          "target": "~/scroll-based-character-reveal/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "reveal-effect-html-demo",
      "title": "Reveal Effect",
      "description": "Example of Reveal Effect with a vertical slide, blur fade-in, and clipping reveal effect using HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "https://atlasui.dev/r/reveal-effect-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/reveal-effect-html-demo/index.html",
          "type": "registry:file",
          "target": "~/reveal-effect/index.html"
        },
        {
          "path": "registry/html/examples/reveal-effect-html-demo/style.css",
          "type": "registry:file",
          "target": "~/reveal-effect/style.css"
        },
        {
          "path": "registry/html/examples/reveal-effect-html-demo/script.js",
          "type": "registry:file",
          "target": "~/reveal-effect/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "reveal-effect-speed-html-example",
      "title": "Reveal Effect HTML Example 1",
      "description": "Example of Reveal Effect with a custom speed.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "https://atlasui.dev/r/reveal-effect-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/reveal-effect-speed-html-example/index.html",
          "type": "registry:example"
        },
        {
          "path": "registry/html/examples/reveal-effect-speed-html-example/style.css",
          "type": "registry:example"
        },
        {
          "path": "registry/html/examples/reveal-effect-speed-html-example/script.js",
          "type": "registry:example"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "reveal-effect-delay-html-example",
      "title": "Reveal Effect HTML Example 2",
      "description": "Example of Reveal Effect with a custom delay.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "https://atlasui.dev/r/reveal-effect-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/reveal-effect-delay-html-example/index.html",
          "type": "registry:example"
        },
        {
          "path": "registry/html/examples/reveal-effect-delay-html-example/style.css",
          "type": "registry:example"
        },
        {
          "path": "registry/html/examples/reveal-effect-delay-html-example/script.js",
          "type": "registry:example"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "reveal-effect-translate-y-html-example",
      "title": "Reveal Effect HTML Example 3",
      "description": "Example of Reveal Effect with a custom translate-y.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "https://atlasui.dev/r/reveal-effect-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/reveal-effect-translate-y-html-example/index.html",
          "type": "registry:example"
        },
        {
          "path": "registry/html/examples/reveal-effect-translate-y-html-example/style.css",
          "type": "registry:example"
        },
        {
          "path": "registry/html/examples/reveal-effect-translate-y-html-example/script.js",
          "type": "registry:example"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "loki-text-effect-html-demo",
      "title": "Loki Text Effect",
      "description": "Example showcasing the iconic text animation from the Loki series intro using HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "https://atlasui.dev/r/loki-text-effect-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/loki-text-effect-html-demo/index.html",
          "type": "registry:file",
          "target": "~/loki-text-effect/index.html"
        },
        {
          "path": "registry/html/examples/loki-text-effect-html-demo/style.css",
          "type": "registry:file",
          "target": "~/loki-text-effect/style.css"
        },
        {
          "path": "registry/html/examples/loki-text-effect-html-demo/script.js",
          "type": "registry:file",
          "target": "~/loki-text-effect/script.js"
        },
        {
          "path": "registry/fonts/fontOne.woff2",
          "type": "registry:file",
          "target": "~/fonts/fontOne.woff2"
        },
        {
          "path": "registry/fonts/fontTwo.woff2",
          "type": "registry:file",
          "target": "~/fonts/fontTwo.woff2"
        },
        {
          "path": "registry/fonts/fontThree.woff2",
          "type": "registry:file",
          "target": "~/fonts/fontThree.woff2"
        },
        {
          "path": "registry/fonts/fontFour.woff2",
          "type": "registry:file",
          "target": "~/fonts/fontFour.woff2"
        },
        {
          "path": "registry/fonts/fontFive.woff2",
          "type": "registry:file",
          "target": "~/fonts/fontFive.woff2"
        },
        {
          "path": "registry/fonts/fontSix.woff2",
          "type": "registry:file",
          "target": "~/fonts/fontSix.woff2"
        },
        {
          "path": "registry/fonts/fontSeven.woff2",
          "type": "registry:file",
          "target": "~/fonts/fontSeven.woff2"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "box-reveal-html-demo",
      "title": "Box Reveal",
      "description": "Example of Box Reveal that has a smooth reveal animation that slides a colored overlay away to introduce content as it enters the viewport.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "https://atlasui.dev/r/box-reveal-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/box-reveal-html-demo/index.html",
          "type": "registry:file",
          "target": "~/box-reveal/index.html"
        },
        {
          "path": "registry/html/examples/box-reveal-html-demo/style.css",
          "type": "registry:file",
          "target": "~/box-reveal/style.css"
        },
        {
          "path": "registry/html/examples/box-reveal-html-demo/script.js",
          "type": "registry:file",
          "target": "~/box-reveal/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "notch-nav-html-demo",
      "title": "Notch Nav",
      "description": "Example of a Notch style trigger that reveals the navigation menu from above built with HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "https://atlasui.dev/r/notch-nav-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/notch-nav-html-demo/index.html",
          "type": "registry:file",
          "target": "~/notch-nav/index.html"
        },
        {
          "path": "registry/html/examples/notch-nav-html-demo/style.css",
          "type": "registry:file",
          "target": "~/notch-nav/style.css"
        },
        {
          "path": "registry/html/examples/notch-nav-html-demo/script.js",
          "type": "registry:file",
          "target": "~/notch-nav/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "morph-navbar-html-demo",
      "title": "Morph Navbar",
      "description": "Example of Morph Navbar with a fluid, morphing pill that tracks the active link and hover state built with HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "https://atlasui.dev/r/morph-navbar-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/morph-navbar-html-demo/index.html",
          "type": "registry:file",
          "target": "~/morph-navbar/index.html"
        },
        {
          "path": "registry/html/examples/morph-navbar-html-demo/style.css",
          "type": "registry:file",
          "target": "~/morph-navbar/style.css"
        },
        {
          "path": "registry/html/examples/morph-navbar-html-demo/script.js",
          "type": "registry:file",
          "target": "~/morph-navbar/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "cascade-text-html-demo",
      "title": "Cascade Text",
      "description": "Example of Cascade Text with a smooth line-by-line reveal built with HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "https://atlasui.dev/r/cascade-text-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/cascade-text-html-demo/index.html",
          "type": "registry:file",
          "target": "~/cascade-text/index.html"
        },
        {
          "path": "registry/html/examples/cascade-text-html-demo/style.css",
          "type": "registry:file",
          "target": "~/cascade-text/style.css"
        },
        {
          "path": "registry/html/examples/cascade-text-html-demo/script.js",
          "type": "registry:file",
          "target": "~/cascade-text/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "letter-swap-html-demo",
      "title": "Letter Swap",
      "description": "Example of Letter Swap that swaps the letters vertically on hover built with HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [
        "https://atlasui.dev/r/letter-swap-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/letter-swap-html-demo/index.html",
          "type": "registry:file",
          "target": "~/letter-swap/index.html"
        },
        {
          "path": "registry/html/examples/letter-swap-html-demo/style.css",
          "type": "registry:file",
          "target": "~/letter-swap/style.css"
        },
        {
          "path": "registry/html/examples/letter-swap-html-demo/script.js",
          "type": "registry:file",
          "target": "~/letter-swap/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "warp-slider-html-demo",
      "title": "Warp Slider",
      "description": "Example of a smooth, infinite slider with dynamic warp distortion and momentum based scrolling built with HTML, CSS, JavaScript and Three.js.",
      "dependencies": [
        "three"
      ],
      "registryDependencies": [
        "https://atlasui.dev/r/warp-slider-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/warp-slider-html-demo/index.html",
          "type": "registry:file",
          "target": "~/warp-slider/index.html"
        },
        {
          "path": "registry/html/examples/warp-slider-html-demo/style.css",
          "type": "registry:file",
          "target": "~/warp-slider/style.css"
        },
        {
          "path": "registry/html/examples/warp-slider-html-demo/script.js",
          "type": "registry:file",
          "target": "~/warp-slider/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "warp-slider-horizontal-html-demo",
      "title": "Warp Slider Horizontal Demo",
      "description": "Example of Warp Slider component in horizontal orientation with dynamic warp distortion and momentum based scrolling built with HTML, CSS, JavaScript and Three.js.",
      "dependencies": [
        "three"
      ],
      "registryDependencies": [
        "https://atlasui.dev/r/warp-slider-html.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/warp-slider-horizontal-html-demo/index.html",
          "type": "registry:example"
        },
        {
          "path": "registry/html/examples/warp-slider-horizontal-html-demo/style.css",
          "type": "registry:example"
        },
        {
          "path": "registry/html/examples/warp-slider-horizontal-html-demo/script.js",
          "type": "registry:example"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "fancy-theme-toggle-html-demo",
      "title": "Fancy Theme Toggle",
      "description": "Example of Theme Toggle from the classic Designer vs Developer meme, built with HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion",
        "lucide"
      ],
      "registryDependencies": [
        "https://atlasui.dev/r/fancy-theme-toggle.json"
      ],
      "files": [
        {
          "path": "registry/html/examples/fancy-theme-toggle-html-demo/index.html",
          "type": "registry:file",
          "target": "~/fancy-theme-toggle/index.html"
        },
        {
          "path": "registry/html/examples/fancy-theme-toggle-html-demo/style.css",
          "type": "registry:file",
          "target": "~/fancy-theme-toggle/style.css"
        },
        {
          "path": "registry/html/examples/fancy-theme-toggle-html-demo/script.js",
          "type": "registry:file",
          "target": "~/fancy-theme-toggle/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "magnetic-hover-html-demo",
      "title": "Magnetic Hover",
      "description": "Example of Magnetic Hover component, built with HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/html/examples/magnetic-hover-html-demo/index.html",
          "type": "registry:file",
          "target": "~/magnetic-hover/index.html"
        },
        {
          "path": "registry/html/examples/magnetic-hover-html-demo/style.css",
          "type": "registry:file",
          "target": "~/magnetic-hover/style.css"
        },
        {
          "path": "registry/html/examples/magnetic-hover-html-demo/script.js",
          "type": "registry:file",
          "target": "~/magnetic-hover/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "typewriter-html-demo",
      "title": "Typewriter",
      "description": "Example of typewriter component that cycles through text with a synced flashing highlight animation built with HTML, CSS, JavaScript and Motion.",
      "dependencies": [
        "motion"
      ],
      "files": [
        {
          "path": "registry/html/examples/typewriter-html-demo/index.html",
          "type": "registry:file",
          "target": "~/typewriter/index.html"
        },
        {
          "path": "registry/html/examples/typewriter-html-demo/style.css",
          "type": "registry:file",
          "target": "~/typewriter/style.css"
        },
        {
          "path": "registry/html/examples/typewriter-html-demo/script.js",
          "type": "registry:file",
          "target": "~/typewriter/script.js"
        }
      ],
      "meta": {
        "framework": "html"
      },
      "type": "registry:example"
    },
    {
      "name": "utils",
      "dependencies": [
        "clsx",
        "tailwind-merge"
      ],
      "files": [
        {
          "path": "registry/react/lib/utils.ts",
          "type": "registry:lib"
        }
      ],
      "type": "registry:lib"
    }
  ]
}