Where is the Inspect Tab?

For what it’s worth, I’m not sure I really see the need for a “Developer” perspective at all.

One of the points of Figma (unless I’m just wrong here) is to bridge the gap between designer and developer. If we start breaking Figma into “designers look at it this way, developers this way (more of an output-only view)” we begin to drift apart from a very useful overlap. Not to mention we already have tools that work that way.

We need designers to think a little more like developers, and we need developers to think a little more like designers. Figma covers that ground fairly well, but I think something along the line of an “advanced” tab would be a useful way of maintaining a single perspective with some capabilities isolated for what should probably be thought more of as a “power user” or developer/designer.

Having the same problem. Tab is not there anymore and as a dev new “dev” tab is not useful at all. I want to copy-paste the whole whatever-it-generated and clean it up myself, not having the configuration split into 4 different windows based on random attributes. This is why we picked figma in the first place, removing this feature is blind.

Figma please bring back the default Inspect Tab since Dev-Mode is opt-in and requires payment after the beta.

Greetings people of the community. Am having the same problem, i can’t find the Inspect Tab. Is it a general problem?

@chiagozie_Oscar_Favour It’s not a problem, you just need to switch to the “Dev Mode”.

Guys, you can use the ‘Figma to Code’ plugin.
This option is more convenient for me than the one Figma offers by default.

It’s not that the tab can’t be found or that we can’t copy the CSS (please see original post). My second post in this thread discovers it in the Developer tab.

The problem is that, in the Developer tab, we can’t edit the CSS directly, which is something you used to be able to do right in the Inspect tab in the Design mode. When Dev Mode went live, I had some work to do, saw the inspect tab was gone, I activated Dev mode, found the CSS blocks, but you can only copy, you can’t edit or paste. Many Figma users rely on this feature.

The plugin you mention is one of a few good ones for rendering out the code but it doesn’t fix this problem. Every time I tweak a padding or something I don’t want to have to use the UI, I just want to edit the CSS directly (like we all used to).

You have never been able to edit CSS in the Inspect panel. It just wasn’t possible.

Admittedly I haven’t been using Figma that long, but I’m pretty sure I have done this in the past. I’ve also made the issue clear directly to Figma (I got a couple emails from them on the matter) and they never told me, “you could never do this.” Maybe I was using a plugin or something (I have a few installed), but it seemed to just work.

Previously, no plugin could affect the Inspect panel. Now, with the release of Dev mode, plugins can only generate code (codegen plugins). And in both cases it is impossible to edit the code manually. You are probably confusing something. The only way you could change the code in the Inspect panel was if you were working in a browser and some browser extension could make changes to the Figma frontend. But again, there has never been a native code editing function.

Again it’s curious that not one other person anywhere has said this, and in fact others have told me that they miss the feature as well. Not sure what’s going on here.