Figma for Developers Figma for Developers

Inspect Tool Exercise

Learning Paths:
Topics:
Check out a free preview of the full Figma for Developers course:
The "Inspect Tool Exercise" Lesson is part of the full, Figma for Developers course featured in this preview video. Here's what you'd learn in this lesson:

Students are instructed to get comfortable with the inspect tool by attempting to match the provided "confirm your action" modal in the provided CodePen.

Get Unlimited Access Now

Transcript from the "Inspect Tool Exercise" Lesson

[00:00:00]
>> Just try it out for a little bit cuz you will be on the receiving end of design at one point, whether it's your own or somebody else's, is we've got a template of a code pen. And you can cheat and look at the answer. But take a second and see, okay, let's get comfortable just playing around and inspecting some of the different pieces like, what font is this?

[00:00:18] And what font weight and stuff along those lines. It might be otherwise kind of tedious to play around with. The Inspect tool is super useful for you as an engineer, as you go to implement the design. So take a few minutes, fire up the code pen, try to implement it.

[00:00:31] We'll just look at the completed example at the very end to see what we ended up with so you can compare notes or you can just look at it, as well. But take a little bit, play around with the Inspect tool, get a sense of it, get a feel for it.