Custom Component Basics

What is a Custom Component? 

 Custom Components encapsulate common styles, for example for buttons, links, or input elements. Once you've established the style of your application, convert them into custom components for easy reuse across different sections of your prototype. The advantage over copy-pasting is that modifications to a component automatically apply to all instances of that component, making it easy for you to maintain a uniform style throughout your application! 

Flowrabbits Custom Components are similar to Components in Figma making your creations reusable across your Flowrabbit applications!

How do I create a Custom Component?

Follow these steps to create a custom component:

  1. Design a UI element or group several elements as needed. Use the premade components for this and adjust their appearance until you reach your desired look.
  2. Select the element, then click 'Create a reusable component' in the middle of the top toolbar (look for the outlined diamond-icon).
  3. Enter the component's name in the dialog.
  4. Click 'Create.'

Your custom component has now been saved to your component library. You can find it by clicking on "Components" (diamond-icon on the left of the topbar) under the "My Components" Section

Was this article helpful?

Reusing, Updating and Unlinking Custom Components