Element Tool Overview – Google Web Designer

Articles, Blog

Element Tool Overview – Google Web Designer

Element Tool Overview –  Google Web Designer


hello everyone my name is Valerio and
I’m an engineer on Google web designer in this video I will give you a quick
overview of the element tool the element tool is a content creation tool which
allows you to visually create HTML elements for your document now let me
show you how to use the element tool select the element tool by clicking on
its icon in the tool list if you don’t remember which icon to click mouse over
the icon to get the corresponding tool name or use the keyboard shortcuts to
toggle between tools with the element tool selected I can start creating new
elements to do so I click anywhere on the stage to mark my starting point or
top left corner of my element then while holding the left button down I can drag
the mouse to define the size of my element while dragging you can see the
actual dimension of the element releasing the mouse button will commit
the visual preview create the element and add it to the document I can
visually draw the element in all four cardinal direction so your starting
point does not necessarily have to be the top-left corner as you can see on
your screen the visual preview will automatically snap to nearby elements to
help you lay out your content more easily additionally I can hold down the
shift key while dragging to constrain both the width and height to be the same holding the Alt key will instead draw
the element from the center point out both keys can be combined to draw a
perfect square from the center out finally you can use the space key to
move the entire element before committing it to the document as you
might have noticed all the elements created our divs
by default the element tool creates development but you can change which
type of element to create from the tools option bar in the tool option bar the
first three button allow you to create div image and video elements I can click
on the image button then use the element tool to add an image to my document if
you want to add any other HTML elements click on the custom element button type
the element name and then use the element to add it finally the option bar
allows you to set the background color and border radius of your element before
adding it so let’s switch back to the development then click on the background
color chip and pick a solid background then to the border radius and set 40
pixels all around now when using the element tool all newly created is will
have a set background and border radius that’s it for the overview of the
element tool hope you enjoyed the video and thanks for watching

2 thoughts on Element Tool Overview – Google Web Designer

Leave a Reply

Your email address will not be published. Required fields are marked *