Header User

Last updated on June 19, 2024

Adds a user dropdown for the header component.

Requirements

To use the buttons component in Figma please install the latest version of the Insites Font Icons.

Download the latest font file here.
Install the font file on your machine.
Restart Figma to load the file in your font list.

How to change icons in Figma

Open the icons list here.
Select and copy the icon you want to use from the list
Paste the icon into the icon layer in the component.

Figma Component Variant Properties

Header User

Properties	Options	Notes
Hover	True, False	Enable or disable to show the hover or default state of the component.

Note

This component is only used as a nested component in the Header component.

Header User Options Dropdown

No variants added for the component, use Figma prototype to show the dropdown menu for the user. See the component demo section on Figma for more details.

Header User Options / Breakpoint > 630

Properties	Options	Notes
Type	Profile, Logout	Select to use the link item to profile or logout page.
Hover	True, False	Enable or disable to show the hover or default state of the component.

Note

This component is only used as a nested component in the Header component.

Header User Options / Breakpoint < 630

Properties	Options	Notes
Type	Profile, Logout	Select to use the link item to profile or logout page.

Note

This component is only used as a nested component in the Header component.

Have a suggestion for this page?

Didn't quite find what you are looking for or have feedback on how we can make the content better then we would love to hear from you. Please provide us feedback and we will get back to you shortly.