Skip to content

@codrops Codrops

All

    Repositories list

    345 repositories

    • RotatingOnScrollAnimations

      Public
      Some ideas for animating images in 3D while scrolling.
      HTML
      •
      MIT License
      •12•34•0•0•Updated Jun 18, 2026Jun 18, 2026

    • CodropsTemplate

      Public template
      Codrops demo template. Wiki 👉
      CSS
      •
      MIT License
      •32•138•0•0•Updated May 31, 2026May 31, 2026

    • EaseReverseClipMenu

      Public
      A playful menu demo exploring GSAP's easeReverse
      JavaScript
      •
      MIT License
      •3•8•0•0•Updated Apr 22, 2026Apr 22, 2026

    • CodropsBranding

      Public
      Codrops logos
      9•11•0•0•Updated Feb 20, 2026Feb 20, 2026

    • ScrollTextMotion

      Public
      On-scroll animations for typogrphic elements with GSAP
      animationgsapscrolltrigger
      animationgsapscrolltrigger
      HTML
      •
      MIT License
      •14•42•0•0•Updated Dec 19, 2025Dec 19, 2025

    • BalloonButton

      Public
      TypeScript
      •6•7•0•0•Updated Aug 20, 2025Aug 20, 2025

    • ElasticGridScroll

      Public
      A scroll effect where each column of a grid moves at a slightly different speed, creating a soft, elastic feel as you scroll.
      HTML
      •
      MIT License
      •12•58•0•0•Updated Jun 3, 2025Jun 3, 2025

    • KineticTypePageTransition

      Public
      A concept for a kinetic typography based page transition.
      JavaScript
      •
      MIT License
      •39•125•0•0•Updated May 30, 2025May 30, 2025

    • coding-challenge-planner

      Public
      Daily Frontend Coding Challenge Planner built with Bolt.new
      MIT License
      •1•1•0•0•Updated May 12, 2025May 12, 2025

    • 3DCarousel

      Public
      An on-scroll 3D carousel
      HTML
      •
      MIT License
      •17•58•0•0•Updated May 7, 2025May 7, 2025

    • RepeatingImageTransition

      Public
      HTML
      •
      MIT License
      •6•27•0•0•Updated May 1, 2025May 1, 2025

    • SlideshowAnimations

      Public
      A collection of ideas for slideshow animations.
      JavaScript
      •
      MIT License
      •65•305•1•0•Updated Apr 13, 2025Apr 13, 2025

    • OneElementScroll

      Public
      A simple concept of animating one element across different waypoints on scroll using GSAP Flip and ScrollTrigger.
      JavaScript
      •
      MIT License
      •30•73•2•0•Updated Nov 20, 2024Nov 20, 2024

    • Staggered3DGridAnimations

      Public
      A playful concept where we use scroll-based animations to create 3D grid effects and other transitions.
      HTML
      •
      MIT License
      •16•98•0•1•Updated Oct 27, 2024Oct 27, 2024

    • ContextAwareLogoAnimationScroll

      Public
      Exploring how fixed elements can hide and reveal based on scroll interactions with playful, context-aware animations.
      JavaScript
      •
      MIT License
      •12•58•0•0•Updated Oct 9, 2024Oct 9, 2024

    • OnScrollLayoutFormations

      Public
      Layout formations on scroll using GSAP
      gsapgsap-scrolltrigger
      gsapgsap-scrolltrigger
      HTML
      •
      MIT License
      •22•116•2•0•Updated Sep 19, 2024Sep 19, 2024

    • OnScrollSVGFilterText

      Public
      A small set of scroll-based SVG filter animations on HTML text.
      JavaScript
      •
      MIT License
      •8•57•0•0•Updated Aug 22, 2024Aug 22, 2024

    • GooeyTextHoverEffect

      Public
      A gooey text hover effect using SVG filters
      javascriptcssweb-design
      javascriptcssweb-designsvg-filter
      HTML
      •
      MIT License
      •36•156•1•0•Updated Aug 6, 2024Aug 6, 2024

    • ParticleEffectsButtons

      Public
      A little library that can be used for bursting particles effects on buttons and other elements
      animationbuttonjavascript-library
      animationbuttonjavascript-libraryparticlesanimejs
      JavaScript
      •152•1.3k•2•0•Updated Aug 5, 2024Aug 5, 2024

    • Animocons

      Public
      Animated icons powered by the motion graphics library mo.js by Oleg Solomka. Inspiration comes from the Dribbble shot ["Like Animation"](https://dribbble.com/sh…
      JavaScript
      •174•1.5k•4•0•Updated Aug 5, 2024Aug 5, 2024

    • SidebarTransitions

      Public
      Some inspiration for transition effects for off-canvas navigations.
      CSS
      •245•1.7k•9•1•Updated Aug 5, 2024Aug 5, 2024

    • PageTransitions

      Public
      A showcase collection of various page transition effects using CSS animations.
      CSS
      •449•2.3k•13•2•Updated Aug 5, 2024Aug 5, 2024

    • LineTextHoverAnimations

      Public
      Some hover animations for a terminal-like look
      HTML
      •
      MIT License
      •29•154•0•0•Updated Jun 19, 2024Jun 19, 2024

    • PushGridItems

      Public
      Animations for grid items based on a concept by Rémi Clauss.
      JavaScript
      •
      MIT License
      •11•39•0•0•Updated Jun 5, 2024Jun 5, 2024

    • IntroGridMotionTransition

      Public
      A little hover motion effect on a grid and an intro animation.
      JavaScript
      •
      MIT License
      •25•66•0•0•Updated May 29, 2024May 29, 2024

    • OnScrollTextHighlight

      Public
      Some scroll-based effects for text highlights
      JavaScript
      •
      MIT License
      •22•96•1•0•Updated May 23, 2024May 23, 2024

    • ScrollBlurTypography

      Public
      Animations for revealing blurry text on scroll.
      JavaScript
      •
      MIT License
      •27•147•1•0•Updated Apr 23, 2024Apr 23, 2024

    • ReflectionScroll

      Public
      An decorative reflection effect where we simulate a reflected page and scroll it along with the content.
      HTML
      •
      MIT License
      •10•31•0•0•Updated Apr 14, 2024Apr 14, 2024

    • ImageExpansionTypography

      Public
      An expanding image animation inside of a typographic block.
      JavaScript
      •
      MIT License
      •11•47•0•0•Updated Apr 2, 2024Apr 2, 2024

    • HoverGrid

      Public
      A grid item reveal animation on hover inspired by Metalab
      CSS
      •
      MIT License
      •20•39•0•0•Updated Mar 13, 2024Mar 13, 2024
    ProTip! When viewing an organization's repositories, you can use the props. filter to filter by custom property.