Barath Kumar's Work | ContraWork by Barath Kumar
Barath Kumar

Barath Kumar

AI & Full-Stack Developer helping businesses build smart dig

    1
    Followers
Followed by GALLERY L

Chennai, India

WorkPostsAbout

Chennai, India

I gave my portfolio a proper upgrade, and honestly, this was the most fun I’ve had building something in a long time. Instead of a regular scroll-down page, the site is a story told through a living sky. As you scroll, the sky shifts through different moods, with clouds, stars, aurora, floating islands, a little entity that follows along, and drifting particles. There isn’t a single image behind it. The entire sky is one hand-written WebGL fragment shader, drawn procedurally, with no Three.js or any 3D library. What’s inside 🌌 The sky: Raw WebGL with a custom shader. Each section has its own sky state, the entity moves on springs, resolution adapts to the device, and it respects reduced-motion and Save-Data settings. 🎬 Scroll storytelling: GSAP + ScrollTrigger power a project stack, a route that draws itself as you scroll, an About statement that lights up word by word, stack rows that uncover, and a nav that tracks where you are. Lenis keeps wheel scrolling buttery smooth, while touch scrolling on phones stays native. 🎯 Details I obsessed over: I recreated Emil Kowalski’s easing curves with GSAP CustomEase so JavaScript animations feel identical to the CSS ones. Button presses, hovers and the mobile menu use pure CSS transitions and keyframes. 🎨 Design: Plain CSS with a token file and one stylesheet per section, with no Tailwind and no CSS-in-JS. Typography uses the Archivo variable font, with its width axis doing compressed titles, normal body text and expanded labels. Icons are by Phosphor, and screenshots are WebP, with lighter 800px versions for phones. 📬 Enquiries: The contact form runs on Web3Forms, and falls back to a pre-filled mailto: if no key is set. Tech stack React 19 · Vite 8 · JavaScript (ES modules) · GSAP 3 (ScrollTrigger, CustomEase) · Lenis · Raw WebGL/GLSL · Plain CSS · Archivo Variable · Phosphor Icons · Web3Forms · oxlint · Vercel Runtime dependencies are just React, React DOM, GSAP, Lenis, the font package and Phosphor. I kept it lean on purpose. 👉 See it live: https://barath-freelancing.netlify.app/ Got a project that deserves a little more wow? Let’s build it together. 🚀
2
2
26
🍜 Introducing Hong Zao — Modern Chinese Kitchen I created a premium restaurant website concept inspired by Chinese cuisine, using a bold red-and-gold identity, elegant typography, immersive food imagery, and a menu-focused layout. The experience includes a restaurant story, signature dishes, a dining gallery, and reservation-focused calls to action. The goal: turn a restaurant's identity into a polished digital experience that looks memorable and makes exploring the menu effortless. This is a fictional portfolio concept, built to showcase my web design and frontend development work. Building something similar for your restaurant or business? Let's connect! #WebDesign #FrontendDevelopment #UIDesign #RestaurantWebsite #Portfolio
2
2
46
Hey everyone! 👋 I had a lot of fun building this BMW M3 website! 🏎️ I wanted to experiment with cinematic animations, scroll interactions, lighting effects, and make the car reveal feel more aggressive and immersive. One of my favourite parts was working on the headlight reveal — starting from a completely dark screen and bringing the car to life as you scroll. Getting the timing and overall feel right was a fun challenge. This project gave me a chance to experiment, try new ideas, and push my frontend development skills a little further. 🔗 Check out the live experience: https://bmwm30.vercel.app/ (https://bmwm30.vercel.app/#top) Always excited to build more creative and interactive web experiences! Got an interesting idea or project in mind? Feel free to reach out! 🤝 📩 Email: barathfreelancing@gmail.com (https://barathfreelancing@gmail.com)
0
20
Recently completed a premium real-estate website project focused on modern design, property presentation, responsive UI, and lead generation. Due to client confidentiality, I’m unable to officially share the actual client website publicly. However, I can share a sample website I created for the client before accepting the project to demonstrate the design direction and development quality: 🔗 https://real-estate-web-sample.vercel.app/ Key areas demonstrated: Premium real-estate UI Responsive design Property presentation Location visualization Interactive sections Lead-generation focused design Tech: React · JavaScript · HTML · CSS I’m currently available for freelance website projects. If you're interested in working together, I can share relevant work and discuss your requirements before accepting the project.
1
78