Jyoti Ogennavar’s Post

That's why I always recommend using CMS! It’s an easy way to manage products and details, plus animations on CMS lists are far more efficient than on separate elements!

Useful dev resource ⚡️ A collection of Tailwind CSS button animations designed to make your website look better. → buttons.ibelick.com by @Ibelick

Now available on LottieFiles for Figma: Download your animations in multiple formats! Choose from GIF, MOV, MP4, MPEG, Lottie JSON, dotLottie, and Optimized dotLottie. Enhance your workflow with seamless exporting and try it now: https://lnkd.in/dMCFJAKA #lottiefiles #figma #figmatolottie #lottie #lottieanimations #lottiefilesforfigma #figmaplugin #motiondesign

Creating hover animations with CSS? They don’t perform well on mobile devices. Instead of relying on screen width, use @media screen and (pointer: fine). This ensures hover animations only activate on devices with accurate pointers, like a mouse, regardless of screen size.

Just wrapped up the hero section for Alico a property management and development company, featuring smooth scroll animations and a modern tech stack: • Next.js for performance • TailwindCSS for styling • Lenis for those silky-smooth animations P.S. This is a concept redesign. #webdesign #webdevelopment #realestate

My latest work is a static website developed using React and Tailwind. Animations were added to the homepage. You can check it out here https://lnkd.in/dm55Vd5g The website is still under development #ٌReact #Tailwind #Responsive

yesterday we finish a login page now i'll finish a signup can login I walk you through the process of creating a responsive signup page using React and Framer Motion. We'll cover the following topics: Setting up the project Creating a custom hook for media queries Implementing a signup form with Ant Design Adding animations with Framer Motion Handling form submission and displaying messages

Learn how to build stunning preloader animations for your Framer website - no coding required! In this step-by-step guide, we'll walk you through creating smooth, professional loading screens that automatically trigger when your website loads. Perfect for both beginners and intermediate Framer designers, you'll discover how to use components and interactions to craft seamless loading experiences that will elevate your web projects. 🔥 What you'll learn: • How to design custom preloader animations • Setting up auto-trigger animations • Two different preloader designs: [once you get the trick, you can design literally anything] • Component interaction techniques • Tips for smooth transitions and effortless integration Link to full tutorial: https://lnkd.in/gNZf3PZe

Just wrapped up a deal for a 5-page business website packed with bold designs and epic interactions—scroll-trigger animations, sticky sections, mega menus, you name it! 💻💥 The deadline? Tight. But hey, what’s life without a little challenge, right? 😅 Using the Mast system to bring this project to life. Alhamdulillah, it’s all coming together. Charged way less than my usual rate, but sometimes you just know it’s worth it in the long run. 🚀 Stay tuned—can’t wait to share the final product! #Webflow #WebDesign #ChallengeAccepted #buildinpublic #gsap #landingpage

Taming the :hover Pseudo-Class for Creative Effects The humble :hover pseudo-class can be a powerful tool for adding interactivity and visual interest to your web pages. But beware of overdoing it! Here are some tips for using :hover effectively: Subtle effects: Opt for subtle changes like color shifts, opacity adjustments, or basic transformations. Clear affordances: Use hover to provide clear visual cues for interactive elements like buttons or links. Avoid animation clutter: Don't overdo animations on hover to prevent overwhelming users. #frontenddev #css #webdev #hover #effects #userexperience #webdevelopment