logo

A responsive main site navigation element that can house a variety of menus or toolbar actions, titles, and logo.

Use the header component on the top of your page. The header component can contain the page logo, navigation, search/login features or a variety of other actions that a user might need to interact with.

Responsive Logo and MenuResponsive With ToolbarClose ButtonBack ButtonIcon Toolbar
Prop
Type
Description
Notes
Slot
Description
Notes

Include the sketch library in your project. Insert the symbol lobster-core / lobster-header / lobster-header

Customize content by swapping out symbols with your own custom symbols or removing them entirely.

Customize the text styles by creating your own or using a previously existing style in your project.

Save your customizations as a symbol in your project. Developers will still be able to see the connected component as long as the styleguide is linked in Zeplin and the symbol names are identical.

Use the individual parts of the component located at lobster-core / lobster-header / Parts

Accessible
ie11 compatible
Included in Sketch Library
Known Bugs & Limitations
Provide feedback