Start Here
Overview
Reference-first map of StringTune-3D, its CSS-first runtime model, and the docs structure.
StringTune-3D
StringTune-3D is a StringTune module that turns DOM elements into a synchronized 3D scene. The public integration surface is intentionally small:
- register one provider
- register the
String3Dmodule - mark up elements with
string="3d" - drive transforms, materials, lights, text, SVG, and filters through CSS custom properties
What matters first
string-tune-3ddepends on@fiddle-digital/string-tuneand a renderer implementation such asthree.- The main runtime export is
String3D. - The default engine bridge is
ThreeJSProvider. - Most day-to-day authoring happens in HTML attributes and CSS variables, not in imperative scene code.
How to read this docs site
- Start with Installation, Quick Start, and Three.js Provider.
- Read the Concepts section if you need to understand how DOM objects become scene nodes.
- Use Objects Overview when you need the contract for a specific
string-3dtype. - Use Rendering for materials, textures, filters, and registry-based extensions.
- Use API Overview for exact exports and class boundaries.
Runtime model
At runtime, String3D owns four major pieces:
- a renderer container attached to the page
- a camera
- a scene graph of
String3DObjectinstances - a synchronizer that reads DOM state and applies it to 3D objects every frame
That means you do not manually position meshes in normal usage. The DOM remains the source of truth.
Public boundary
The supported public surface comes from package exports such as:
String3DThreeJSProviderString3DSceneString3DCustomMaterialRegistryString3DCustomFilterRegistryString3DFontRegistrySVGParser
Everything else should be treated as internal unless it is exported by the package root.