Truly great design happens through prototyping.

Free Trial Buy $99

Available on Mac

Create a prototype to validate your decisions and explain the implementation of your design. Framer fits your process and works with the tools you already use.

  • Direct every detail

    Your compositions are begging for movement. Bring them to life by creating expressive animations and innovative interaction patterns.

    View example prototypes
  • Realize your creativity

    Writing code doesn’t limit your creativity—it provides new creative opportunities. Explore additional aspects of your design that you previously couldn’t.

    Learn prototyping with Framer
  • Do more with less code

    Create interactions in just a few lines of code. Framer works with CoffeeScript, which is easy to learn. Less knowledge is required than designing in the browser.

    Read the docs

    Design for any device

    Explore interactions for mobile platforms, desktop apps, and websites. Choose from 8 pre-installed devices to demonstrate the real environment for your design.

    Design with Framer

    Watch an hour-long presentation about prototyping, design tools and the the basic building blocks on which Framer was built.

    Watch Video

    Keep your design process

    Framer works with familiar tools, so adding prototyping won’t mess up your process. You can import a design directly from Sketch or Photoshop and bring in revisions seamlessly.

    Learn about import

    Build and experience your designs

    When designing for mobile, the best way to validate concepts is to experience them on the actual device. Preview your prototypes on a real mobile device with Mirror.

    Learn about mirror
    • Editor
    • Readable Syntax

      Write animations and interactions in a legible and minimal way.

    • Code Snippets

      Use snippets to quickly access reusable blocks of code.

    • Inline Errors

      Discover errors and correct them with the inspector.

    • Auto-Complete

      Includes functions, properties and variables you define.

    • Viewer
    • Live Feedback

      Every edit is rendered in the viewer and on connected devices.

    • Present

      Use the full-screen mode for immersive demos.

    • Preview Modes

      Create prototypes for Desktop, Tablet and Mobile.

    • Zoom & Rotate

      Work in any orientation, pixel-density or zoom-to-fit.

    • Effects
    • Visual Filters

      Blur, brightness, contrast, hue, saturation and more.

    • Animation Curves

      Linear, easing and three different spring physic engines.

    • 3D Effects

      Transform and animate any layer in 3D space.

    • State Machine

      Create complex interactions with sets of animatable properties.

    • Workflow
    • Instant Sharing

      Upload and share your prototypes with a single click.

    • Mirror

      Preview your prototypes on any iOS or Android device.

    • Webkit 2.0

      Built on the latest, fastest web technology.

    • Drag & Drop

      Drop images from anywhere directly on the viewer.