Expand a heading for detailed instructions. Part-specific guidance also appears beside the settings in the inspector.
Getting started, adding parts and presets
Choose Drums, Cymbals, Hardware, Percussion or Electronic Pads in the library, then use Search parts to narrow the list. Drag a part onto the floor or press +. On a phone, tap +.
Title names the whole setup. Change an individual instrument's Display name in the inspector.
Preset offers basic kits, an empty floor and drummer reference setups. Loading one replaces the current layout and opens the 3D view. Undo can reverse a preset load. Save any layout you want to keep as a file first.
For drummer setups, read the displayed source links and notes for the reference period, documented dimensions and estimated details. These are not guaranteed exact reconstructions of a particular performance.
Selecting, clearing and grouping parts
Click or tap an instrument, or select it in Placed parts. Click or tap empty floor to clear either a single or multiple selection. Dragging empty space controls the camera.
Ctrl / Cmd-click adds or removes individual parts. Shift-drag selects parts whose body centers lie inside the rectangle. Ctrl / Cmd+Shift-drag adds to the selection; Esc cancels box selection.
Move or adjust the height of selected parts together. Angle rotates the selected layout horizontally around one shared center; it does not spin each instrument independently in place.
If attachment constraints prevent group rotation, include the parent rack, stand or bass drum. Attached parts keep following their parent during the rotation.
Position, height, angles and numeric editing
In Position mode, drag instruments to move them. The green Height arrow extends a support post or adjusts floor-tom leg mounting points, depending on the part. The current action appears above the drum view.
Use the Angle rings to rotate or tilt. Rotation target can select Body, Stand legs, Hi-hat pedal and other supported sub-parts. Only applicable targets are shown.
Enter precise positions, support heights and angles in the inspector. X runs left/right across the floor; positive Z points toward the player. Diameter and depth use inch; position and support height use cm; floor size uses m; thickness uses mm; angles use °. 1 inch = 2.54 cm.
Leave the input or press Enter to commit a number. Read the displayed guidance when mounting or movement limits constrain a setting.
Mounting, racks and tom holders
Choose a support with Mounting in the inspector. For Clamp to rack / stand, also choose the parent. Adjust the position along the rack, height on a stand post, arm length and horizontal/vertical angles as available.
Attached parts follow their parent rack, stand or bass drum. Placing objects close together does not connect them automatically. When placing independent hardware, set the instrument's mounting to None / independent.
Toms initially use the bass drum's two holder sockets; a stand is used when both are occupied. Change Mounting to use a tom stand or another supported option.
The L-rod has a fixed length and dragging respects the ball joint's range. Rod clamp position changes insertion for one tom; Holder rotation turns both sockets. Adjusting a shared post raises or lowers both mounted toms.
Rack joints, clamps and support arms have controls appropriate to their type and mounting. Parent selectors include an ID next to the display name to distinguish similar parts.
Dimensions, types, heads and finishes
Type switches a selected part to another type in the same category. Display name is also used in the parts list and layout plan. Available settings depend on type and mounting; consult the descriptions beside each field.
Drum controls include diameter, depth, shell thickness, hoops, lugs, tension rods per side, batter/resonant heads, damping, snare wires and the front-head port. Tension-rod counts apply to each side separately.
Adjust shell finish, single/two-tone/gradient colors, transparency, hardware, hoops, heads and internal shell lighting where supported. Available options depend on material and shape.
Cymbals provide type, diameter, finish, perforation and stack count/gap controls. Hi-hats offer upper/lower cymbal and support settings. Percussion and electronic pads have their own dimensions, supports and colors. Electronic pads include nine-zone, single, mesh, silicone and arch types.
Pedals and hi-hat movement
Pedal settings include mount target, drive, beater, footboard shape, angle and finish. Double pedals also provide main-side and slave-pedal position/orientation controls.
Click or tap a supported footboard to animate it. Where available, a pedal-press slider previews the pose. The animation does not play sound.
Select Hi-hat pedal as the Angle rotation target to turn it independently. Remote hi-hats also allow pedal-position adjustments. Check the inspector for controls supported by each mounting type.
Camera, zoom and display quality
On a computer, left-drag empty space to orbit, right-drag to pan and use the wheel to zoom. Camera mode lets you start camera gestures over instruments too.
On a phone, drag empty space with one finger to orbit, use two fingers to pan and pinch to zoom.
3D provides a perspective overview; Top is an orthographic view without perspective; Front looks from the audience side; Player looks from behind the kit.
Switch the normal view between Detailed and Lightweight. Try Lightweight if navigation is slow. Camera-only movements are separate from layout undo history.
Floor size, grid and snapping
Floor size sets width and depth from 2 to 12 m. Grid shows or hides floor markings.
Snap to grid aligns placement to the selected cell size: 2.5, 5, 10, 20 or 50 cm. Select a smaller cell or turn snapping off for finer movement.
Arrow keys move by one cell with snapping on, or 1 cm with snapping off. Shift+arrow keys move in 1 cm steps.
Images, high-quality renders and layout plans
Image saves the current camera view as a PNG without selection outlines or transform handles. This button may be hidden on narrow screens.
High Quality uses the GPU (graphics processor) in a separate preview to calculate reflections, transparency and soft shadows, preferring a high-performance GPU when available. Noise decreases as rendering progresses. Save This Image downloads the PNG.
Preparation and rendering times depend on the device. Close the preview at any time to resume editing. If high-quality rendering is unavailable, use the normal 3D view.
Layout Plan creates a numbered top view plus names and dimensions grouped by instrument type, with one row per part. Review the preview, then choose Save layout plan as PNG.
Images and plans are visual outputs. Use Save Layout separately to retain editable data.
Saving, opening and restoring layouts
Save Layout downloads a JSON layout-data file, using the setup Title as its filename. It includes parts, dimensions, positions, angles, colors, materials, hardware, heads, attachments, floor settings and camera.
Use Open to select a JSON file made by this tool, or drag it into the tool to restore its layout and camera. Loading is processed inside the browser.
If previous work remains in this browser, Restore appears. Press it to restore that temporary copy manually. Its close button hides the recovery notice.
Temporary recovery data belongs to the same browser. Use JSON files to keep important layouts or move them to another device. Clearing browser data or changing the browsing environment can remove temporary recovery data.
Copying, duplication, deletion and undo
Ctrl / Cmd+C: copy the selection. Ctrl / Cmd+V: paste. Ctrl / Cmd+D: duplicate. The inspector also has Duplicate.
Delete / Backspace: delete the selection. The inspector also has Delete.
Ctrl / Cmd+Z or ↶: undo. Ctrl / Cmd+Shift+Z, Ctrl / Cmd+Y or ↷: redo.
Arrow keys: nudge. Shift+arrow keys: move in 1 cm steps.
Part shortcuts are inactive while editing text, number or select fields, or while this help or the high-quality preview is open. On phones, use the on-screen buttons.
Workspace space, action hints and phones
Use the side arrows ‹ / › to show or hide the library and inspector. Maximize in the article expands the tool across the screen; exit it to return to the article.
On phones, Add parts and Edit selected part switch the lower panel between the library and inspector. Controls reflect the selected instrument.
The Position / Height / Angle / Camera row shows the current action while you work. Compact tips at the bottom change regularly with a horizontal slide.
This ? contains the detailed instructions. Expand a heading to read it, then use the top-right × or Esc to return to your work. Save your layout file before switching the article between Japanese and English, as the view reloads.
Limitations and troubleshooting
Shapes and materials are generic 3D models, not exact photographic or optical reproductions. Movement ranges are this tool's settings, not guaranteed specifications of a particular product.
The tool does not simulate contact, tipping, load limits, real-world component compatibility, automatic connection of nearby hardware or musical audio. Check physical safety and compatibility separately when assembling real equipment.
If the 3D view cannot start, use an environment with WebGL (browser 3D graphics) support. Switch to Lightweight if rendering is slow.
When movement or rotation is limited, check mounting, movement ranges and snapping. Include parent parts when required for group rotation. Open the right sidebar or the phone's editing tab if the inspector is hidden.