Powerful prototyping with code

Bring your design to life with code in Figma.

Try for free
Untitled
Square.onTap((event,layer) => {
layer.animate({
scale:,
rotation: ,
borderRadius:
})
})

Made by Diagram     Works with Figma

Design and CodeDesign and Code

Create powerful prototypes with JavaScript that make your design animated and interactive.

Prototyper

Simple to ComplexSimple to Complex

Prototyper is easy to get started and becomes more powerful as you go.

// Drag the brightness slider

Slider.draggable = true 
Slider.draggable.horizontal = false
Slider.draggable.constraints = {
  height: 500
}

Slider.onDragMove((event) => {
  const y = event.y - Container.y
  const brightness = y / Slider.height
  Background.opacity = brightness 
})

PricingPricing

Personal

$12 $9per month

Save 25% for a limited time

$99per year

Save $9/yr with yearly billing

1 license, unlimited use.

  • Unlimited prototypes
  • Over 100 API methods
  • All future updates

Teams

Custom

Unlimited team use.

  • Everything in Personal
  • Bulk team licences

Prototyper is used by designers on these teams:

  • Logo
  • Logo
  • Logo
  • Logo
  • Logo

TwitterWhat Designers Are Saying

  • Designer

    Brian Lovin

    Product Designer

    It feels really nice getting the higher fidelity control while still sitting right next to my layers on the canvas.

  • Designer

    nuelCee

    Product Designer

    Tried out Prototyper today on Figma and it's crazy. Imagine what you could achieve coding right in Figma.

  • Designer

    Junhyuk Jang

    Interaction Designer

    Framer classic vibe in Figma. prototyper.design

  • Designer

    Gavin Nelson

    Product Designer

    classic Framer returns in Prototyper. I am going to have so much fun with this

Get Started with Prototyper

Powerful prototyping with code in Figma.

Try for free

Read the docs     DiscordJoin the Discord