All videosLayout & design
Navigate using arrow keys

Navigate using arrow keys

In this video lesson, we'll show how you can use the keyboard arrows in Webflow to quickly select between elements and their child elements on the canvas. The up arrow selects an element’s parent, the down arrow selects an element’s child, and the left and right arrows select between sibling elements on the same level.

Check out our full list of keyboard shortcuts in the Designer.

Video transcript

[Grimur] When we select between elements, we use the arrow keys to go up and down. We can use the up and down arrow to move between... This is not working, it must be a bug… 

[Grimur]Meg?

[Meg] It’s supposed to work that way.

[Grimur] I’m talking abou–are you serious?

[Meg] Yeah, it’s hierarchical.

[Grimur] ...what?

[Meg] Hierarchical

[Grimur] [over] I got what you said; it’s not a real word.

[Meg] Hierarchical.

[Grimur] Higher oricle.

[Meg] Hierarchical.

[Grimur] Harkle-cull.

[Meg] Higher…

[Grimur][high pitch] Harkle?

[Meg] No, say “higher.”

[Grimur] Higher.

[Meg] Now “archicle.”

[Grimur] No.

[Meg] The up arrow? Selects an element’s parent. The down arrow...selects an element’s child.

[Grimur] Oh. But that doesn’t explain the (left and right…)

[Meg] [over] Left and right? Select between SIBLING elements.

[Grimur] [over]: Sibling elements.

[Meg] That’s right.

[Grimur] Up and down to select between parents and children.

[Meg] Good.

[Grimur] Left and right to select between sibling elements on the same level. Does it 100% make sense now? Nuh---(yes.)

[Meg] Yes.

[Grimur] Higher-archial.