Vectary Documentation
ChangelogFeedbackHelpOpen Studio
  • Welcome to Vectary Docs
  • Documentation
    • Getting started
      • System requirements
      • User interface
      • Rendering
      • Dashboard
      • Account settings
      • Roles
      • Scene orientation
      • Units
    • Importing
      • Import formats
      • Figma frames import
      • CAD files
      • Vectary Processor
    • Design process
      • Design mode
        • Selections tools
        • Primitives
        • 3D Text
        • Light sources
        • Modifiers
          • Array Linear
          • Array Radial
          • Array Grid
          • Array Object
          • Subdivide
          • Bevel
          • Randomize
          • Symmetry
          • Boolean
        • Deformers
          • Bend
          • Twist
          • Taper
          • Skew
          • Stretch
          • Spherify
          • Noise
          • Simplify
        • Setup
          • Group
          • Empty
          • Camera
          • Backdrop
          • Smooth normals
          • Clipping plane
        • Interactive elements
      • Materials and Textures
        • Basic materials
          • Color
          • Roughness
          • Metalness
          • Opacity
          • Emission
          • Normal map
        • Advanced materials
          • Subsurface
          • Refraction
          • Clearcoat
          • Thinfilm
          • Reflectivity
          • Double sided material
        • Baked textures
          • Ambient occlusion (texture)
          • Lightmap
          • Texture remapping
        • Importing own textures
      • Animated materials
      • Decals
      • Camera
      • Environment
      • Background
      • Ground plane
      • Effects
        • Reflections
        • Ambient Occlusion
        • Soft Shadows
        • Fading
        • Smooth edges
        • Adjustments
        • Color Balance
        • Vignette
        • Grain
        • Bloom
      • Control bar
        • Fit View
        • Viewport display modes
        • Gizmo & Origin
        • Snapping
        • Download image
      • Libraries
        • Asset library
        • Materials library
        • Environments library
      • Edit mode
        • Selection tools
        • New object
        • Draw
        • Primitives
        • Extrude
        • Bevel
        • Make circle
        • Bridge
        • Slide
        • Cut
        • Collapse
        • Cap open boundaries
        • Merge faces
        • Mesh Tools
        • Normals
    • 3D configurator
      • Variants
      • Interactions
        • Triggers
        • Conditions
        • Actions
          • Animated texture
          • Animation
          • Cameras
          • Download image
          • Highlight
          • Interactions
          • Materials
          • Link
          • Sounds
          • Transformation
          • Upload image
          • Variants
          • Visibility
          • Send event
          • Set variable
        • Events (for API)
      • Animations
      • Floating UI
        • Floating UI settings
        • Container
        • Materials (UI)
        • Variants (UI)
        • Text
        • Image
        • Button
        • Slider
        • Input
        • Tips
      • Hotspots
      • Variables & Expressions
        • Syntax
        • Functions
        • List of inputs
        • Data import (.csv)
    • Project settings
      • Version history
      • Augmented Reality (WebAR)
      • WebXR (beta)
      • Loading screen
      • Mouse controls
      • Interaction prompt
      • Menu - Settings
    • Sharing, exporting, embedding
      • Sharing
      • Performance analyzer
      • Optimizing a shared project
        • Geometry
        • Textures
        • Materials
        • Effects
        • Light and shadows
        • HDRI
        • Ground plane
        • Tips
      • Project cloning
      • Embedding to other software
      • Export options
    • Other
      • Vectary Plugin for Figma
      • 2D to 3D
      • Selections
      • Comments
      • Shortcuts
  • API
    • Model API
      • Quick Start
      • API Reference
      • Type Definitions
      • Events & Listeners
      • Floating UI
      • Ecommerce
        • Webflow
        • Shopify
        • Custom code
Powered by GitBook
LogoLogo

Website

  • Pricing
  • Blog
  • Security
  • Website

Social

  • YouTube
  • LinkedIn
  • Discord

Copyright © 2025 Vectary Inc. All rights reserved

On this page
  • What are Variables?
  • Expressions
  • Learn more
  • Example
Export as PDF
  1. Documentation
  2. 3D configurator

Variables & Expressions

PreviousHotspotsNextSyntax

Last updated 1 month ago

The ability to use variables within Studio greatly enhances flexibility in configuring interactivity for projects, enabling the creation of complex solutions and systems.

This feature is currently in Beta as we actively refine the experience with variables and expressions. Despite ongoing improvements, it is already highly functional and enhances project capabilities significantly.

What are Variables?

Vectary enables to create and manage variables that can be utilized across various Studio settings. These variables represent data elements such as numbers, text, or formulas, which can be created directly within Studio or imported from external sources like Google Sheets. A variable can store a specific value or use expressions to dynamically determine its value based on other parameters.

Variables are also available for use in and

All variables are centralized for easy access and management:

To delete or rename a variable, right-click on its name

Expressions

Expressions provide a dynamic method for calculating parameter values using functions, binary operators, and variables.

This approach facilitates the creation of procedural effects and enables the implementation of complex solutions.

Learn more

Example

Let's consider a simple example using Variables and Expressions.

Task: create a configuration that allows parametric changes to the length and width of the tabletop.

1

Create a simple table using primitives

2

Create variables: Width and Length

Assign a value of 100 to each as the base size.

3

Assign variables

Assign the created variables to the dimensions along the X and Y axes (replace the value with the variable name)

4

Expression setup

To ensure the position of the table legs changes synchronously with the table dimensions, an expression using the variable must be assigned for the position value of each leg:

Object
X
Y

Leg 1

-width/2+5

-length/2+5

Leg 2

-width/2+5

length/2-5

Leg 3

width/2+5

length/2+5

Leg 4

width/2-5

-length/2+5

5

Add the Floating UI

Add the Floating UI to the scene and create a Text element along with a Slider element. The Text element will dynamically display the table size, while the Slider will be used to adjust the size.

6

Setup Text element

Setup the Text element using an expression so that the table size is dynamically displayed based on the size selected by the end user. Use the following expression: "Width ${width} "

7

Setup the Slider

Setup the Slider element to allow the end user to adjust the dimensions of the table

Specify the variable Width, set the Range and Step:

8

Repeat steps 6 and 7 for the length

Done! The Preview mode can now be activated to check the result:

Most input fields in the UI support expressions (a detailed list can be found ), allowing for real-time modification of various settings, parameters, and text.

here
Slider
Input
Cover

Syntax

Cover

Functions

Cover

List of inputs

Cover

Data import (.csv)