Aframe Webxr

A-Frame lets you build VR and AR experiences using plain HTML instead of wrestling with WebGL or Three.js directly. You get an entity-component architecture where you can drop primitives like boxes and spheres into a scene, add animations with HTML attributes, and have VR controller support working without touching much JavaScript. It's genuinely good for prototyping immersive experiences fast or adding 3D content to web pages when you don't want to manage a full game engine. The declarative approach means you can sketch out a scene in minutes, though you'll still write custom components in JavaScript when you need real interactivity beyond basic animations and clicks.

skills.sh installs: 2.5K
GitHub stars: 1.3K
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add freshtechbro/claudedesignskills --skill aframe-webxr --agent claude-code

Installs into .claude/skills of the current project.

Files

A-Frame WebXR Skill

When to Use This Skill

Build VR/AR experiences with minimal JavaScript
Create cross-platform WebXR applications (desktop, mobile, headset)
Prototype 3D scenes quickly with HTML primitives
Implement VR controller interactions
Add 3D content to web pages declaratively
Build 360° image/video experiences
Develop AR experiences with hit testing

Core Concepts

1. Entity-Component-System (ECS)

A-Frame uses an entity-component-system architecture where:

Entities are containers (like <div> in HTML)
Components add functionality/appearance to entities
Systems provide global functionality

<!-- Entity with components -->
<a-entity
  geometry="primitive: box; width: 2"
  material="color: red; metalness: 0.5"
  position="0 1.5 -3"
  rotation="0 45 0">
</a-entity>

Primitives are shortcuts for common entity + component combinations:

<!-- Primitive (shorthand) -->
<a-box color="red" position="0 1.5 -3" rotation="0 45 0" width="2"></a-box>

SKILL.md on GitHub

Details

Repository: github.com/freshtechbro/claudedesignskills
Categories: Frontend Development, Code Review & Quality, Automation & Workflows
First seen: Jun 3, 2026