Framer book logo
  • Table of Contents
    • Framer for Developers
      Framer for Developers
    • Code Overrides
      Code OverridesBasic OverridesSharing Data Between OverridesOverriding Smart ComponentsOverriding Code ComponentsOverriding Design Components
    • Code Components
      Code ComponentsA Simple Code ComponentComponent StylingComponent SizingMotion-Compatible ComponentsImporting Other Layers, Components, and PackagesCustomizing an Existing ComponentProperty ControlsFlexbox Component
    • Animation
      AnimationThe Animate PropertyThe Transition Property‘While’ Animations and InitialVariantsHooksThe useState() HookAnimate PresenceThe useCycle() HookThe useAnimation() HookKeyframesAnimatable PropertiesAnimation TypesAnimating to a Scroll PositionAPI OverviewExample Animations
    • Framer Motion
      Framer MotionCreate React AppCodeSandboxAutomatic Layout AnimationsLayout GroupLayout IDScroll-based AnimationsSVG AnimationsDrag ControlsRouting
    • Smart Code Components
      Smart Code ComponentsProps Versus StatePassing Down PropsSharing StateLetting a Prop Change the StateSimple But SmartiOS Segmented Control
    • Dragging
      DraggingAxis and Direction LockingDrag ConstraintsDrag ElasticDrag MomentumInertia AnimationsModify TargetMin and MaxSnap to Grid ExampleSnap to Corner ExampleDrag Events
    • Archive
      ArchiveDesign ComponentsOverrides (pre X22)Code Components (pre X22)Animations (pre X22)
  • Updates
  • FAQ
  • Get the book
Login / Register

  • Framer for Developers
    Framer for Developers
  • Code Overrides
    Code Overrides Basic Overrides Sharing Data Between Overrides Overriding Smart Components Overriding Code Components Overriding Design Components
  • Code Components
    Code Components A Simple Code Component Component Styling Component Sizing Motion-Compatible Components Importing Other Layers, Components, and Packages Customizing an Existing Component Property Controls
    Flexbox Component
  • Animation
    Animation The Animate Property The Transition Property ‘While’ Animations and Initial Variants Hooks The useState() Hook Animate Presence The useCycle() Hook The useAnimation() Hook Keyframes Animatable Properties Animation Types Animating to a Scroll Position API Overview Example Animations
  • Framer Motion
    Framer Motion Create React App CodeSandbox Automatic Layout Animations
    Layout Group Layout ID
    Scroll-based Animations SVG Animations
    Drag Controls Routing
  • Smart Code Components
    Smart Code Components Props Versus State Passing Down Props Sharing State Letting a Prop Change the State Simple But Smart iOS Segmented Control
  • Dragging
    Dragging Axis and Direction Locking Drag Constraints Drag Elastic Drag Momentum Inertia Animations Modify Target Min and Max Snap to Grid Example Snap to Corner Example Drag Events
  • Archive
    Archive Design Components Overrides (pre X22) Code Components (pre X22)
    Animations (pre X22)

Framer_basics-Layers-Border_radius-01-Big_blue_button


Code Overrides
Home FAQ Updates
Copyright © 2016-2022 Tes Mat.