--- title: "FreshTechBro (@freshtechbro) ยท skilld" canonical_url: "https://skilld.dev/@freshtechbro" meta: description: "23 skills and 0 collections from @freshtechbro on skilld." "og:description": "Agent skills written by real maintainers in their own GitHub repos, with links to source" "og:title": skilld --- ` ![FreshTechBro on GitHub](https://skilld.dev/_img/avatar?url=https%3A%2F%2Fgithub.com%2Ffreshtechbro.png) # **FreshTechBro** @freshtechbro [GitHub](https://github.com/freshtechbro) ## [freshtechbro/claudedesignskills](https://skilld.dev/gh/freshtechbro/claudedesignskills) 23 skills ![README badge for freshtechbro/claudedesignskills](https://skilld.dev/b/freshtechbro/claudedesignskills?theme=light&label=0) - [skill-creator](https://skilld.dev/gh/freshtechbro/claudedesignskills/skill-creator) Guide for creating effective skills. This skill should be used when users want to create a new skill (or update an existing skill) that extends Claude's capabilities with specialized knowledge, workflows, or tool integrations. Updated 11 months ago![README badge for freshtechbro/claudedesignskills/skill-creator](https://skilld.dev/b/freshtechbro/claudedesignskills/skill-creator?theme=light&label=0) [Read source](https://github.com/freshtechbro/claudedesignskills/blob/main/.claude/skills/skill-creator/SKILL.md) - [aframe-webxr](https://skilld.dev/gh/freshtechbro/claudedesignskills/aframe-webxr) Declarative web framework for building browser-based 3D, VR, and AR experiences using HTML and entity-component architecture. Use this skill when creating WebXR applications, VR experiences, AR experiences, 360-degree media viewers, or immersive web content with minimal JavaScript. Triggers on tasks involving A-Frame, WebXR, VR development, AR development, entity-component-system, declarative 3D, or HTML-based 3D scenes. Built on Three.js with accessible HTML-first approach. Updated 11 months ago![README badge for freshtechbro/claudedesignskills/aframe-webxr](https://skilld.dev/b/freshtechbro/claudedesignskills/aframe-webxr?theme=light&label=0) [Read source](https://github.com/freshtechbro/claudedesignskills/blob/main/.claude/skills/aframe-webxr/SKILL.md) - [animated-component-libraries](https://skilld.dev/gh/freshtechbro/claudedesignskills/animated-component-libraries) Pre-built animated React component collections combining Magic UI (150+ TypeScript/Tailwind/Motion components) and React Bits (90+ minimal-dependency animated components). Use this skill when building landing pages, marketing sites, dashboards, or interactive UIs requiring pre-made animated components instead of hand-crafting animations. Triggers on tasks involving animated UI components, Magic UI, React Bits, shadcn/ui integration, Tailwind CSS components, or component library selection. Alternative to manually implementing animations with Framer Motion or GSAP. Updated 11 months ago![README badge for freshtechbro/claudedesignskills/animated-component-libraries](https://skilld.dev/b/freshtechbro/claudedesignskills/animated-component-libraries?theme=light&label=0) [Read source](https://github.com/freshtechbro/claudedesignskills/blob/main/.claude/skills/animated-component-libraries/SKILL.md) - [animejs](https://skilld.dev/gh/freshtechbro/claudedesignskills/animejs) Versatile JavaScript animation engine for DOM, CSS, SVG, and JavaScript objects. Use when creating timeline-based animations, stagger effects, SVG morphing, keyframe sequences, or complex choreographed animations. Triggers on tasks involving Anime.js, timeline animations, staggered sequences, SVG path animations, morphing, or multi-step animation choreography. Alternative to GSAP for SVG-heavy animations and React-independent projects. Updated 11 months ago![README badge for freshtechbro/claudedesignskills/animejs](https://skilld.dev/b/freshtechbro/claudedesignskills/animejs?theme=light&label=0) [Read source](https://github.com/freshtechbro/claudedesignskills/blob/main/.claude/skills/animejs/SKILL.md) - [babylonjs-engine](https://skilld.dev/gh/freshtechbro/claudedesignskills/babylonjs-engine) Comprehensive skill for Babylon.js 3D web rendering engine. Use this skill when building real-time 3D experiences, browser-based games, interactive visualizations, or immersive web applications. Triggers on tasks involving Babylon.js, 3D scenes, WebGL/WebGPU rendering, entity-component systems, physics simulations, PBR materials, shadow mapping, or 3D model loading. Alternative to Three.js with built-in editor integration and game engine features. Updated 11 months ago![README badge for freshtechbro/claudedesignskills/babylonjs-engine](https://skilld.dev/b/freshtechbro/claudedesignskills/babylonjs-engine?theme=light&label=0) [Read source](https://github.com/freshtechbro/claudedesignskills/blob/main/.claude/skills/babylonjs-engine/SKILL.md) - [barba-js](https://skilld.dev/gh/freshtechbro/claudedesignskills/barba-js) Page transitions library for creating fluid, smooth transitions between website pages. Use this skill when implementing page transitions, creating SPA-like experiences, adding animated route changes, or building websites with smooth navigation. Triggers on tasks involving Barba.js, page transitions, routing, view management, transition hooks, GSAP integration, or smooth page navigation. Works with gsap-scrolltrigger for transition animations. Updated 11 months ago![README badge for freshtechbro/claudedesignskills/barba-js](https://skilld.dev/b/freshtechbro/claudedesignskills/barba-js?theme=light&label=0) [Read source](https://github.com/freshtechbro/claudedesignskills/blob/main/.claude/skills/barba-js/SKILL.md) ## **Curated setups ** Skills grouped for one workflow and installable with one command. ### **No collections yet ** When @freshtechbro publishes a collection, it will appear here. [Browse curators](https://skilld.dev/community)