Prefabs

Getting Started

Prefabs

Utilities

Feedback

Donate

Prefabs

Getting Started

Utilities

Feedback

Github

Donate

Getting Started

Prefabs

Utilities

v1.0

Set Attributes

A utility prefab that allows you set the attributes of any parent layer or parent component frame.

Github

Why use this prefab?

Framer currently has a limited set of ways to set attributes of a layer without having a code override. This prefab lets you nest within a layer or component and it will set the attributes to that layer or component. This means you can set things like role, aria-describedby, aria-controls and so much more. Powerful little prefab that allows you to build more accessible projects today.

Why use this prefab?

Framer currently has a limited set of ways to set attributes of a layer without having a code override. This prefab lets you nest within a layer or component and it will set the attributes to that layer or component. This means you can set things like role, aria-describedby, aria-controls and so much more. Powerful little prefab that allows you to build more accessible projects today.

Why use this prefab?

Framer currently has a limited set of ways to set attributes of a layer without having a code override. This prefab lets you nest within a layer or component and it will set the attributes to that layer or component. This means you can set things like role, aria-describedby, aria-controls and so much more. Powerful little prefab that allows you to build more accessible projects today.

Features

Features

Features

Allows you to set html attributes of any parent layer or component.

No code required

How to use

How to use

How to use

Use the Prefab: Drag the prefab on to the canvas.

Connect: Nest within a component or layer. If it is not in a component set is Component to false. Add any valid html attribute to the array with the name and value.

Done: That is it! You are all set to use this prefab.

Accessbility considerations

Accessbility considerations

Accessbility considerations

Things to consider when using the list prefab:

Avoid using the wrong attributes: While this prefab can accept any attribute be sure to still think about the semantics of your component.

Properties

Properties

Properties

Property

Default

Description

ID

String

Will set the id of any layer or component.

Is Component

Boolean

Sets if the prefab is nested in a component or not. If it is not it will set the first div after its parent the attributes.

Attributes

Array

An array of valid html attributes name:value