Skip to main content
Question

Bring the old css code block back

  • February 2, 2024
  • 6 replies
  • 10842 views

Before the “dev mode”, there was a small space in the sidebar with generated css code.

It could be the most basic for your non “dev mode” subscribers…

It’s fine extracting height, width, border, colors but gradients, box shadow are quite impossible.

Bring the old css code back 🙏

6 replies

tank666
  • 4866 replies
  • February 3, 2024

@Nemo_Cheng,


  • Author
  • 1 reply
  • February 5, 2024

It’s a bad alternative. The original worked better, made sense.


  • 1 reply
  • February 7, 2024

The new Properties panel does not display all styles for an element. For instance, a layer set as Auto Layout container only displays hard-set widths/height and positioning but does not contain the flex code that the Auto Layout is generating. It doesn’t actually display or provide any code in general - you have to copy/paste to find what may be the actual code and even then doesn’t include the flex styles.

Oh, and you also can’t be an Owner/Editor of the document to see the Properties panel in the first place. Forcing you to the next major problem the lack of an Inspect tab has led to:

The Right Click method forces you to copy the properties of the element you want the code for and ALL children of that element. So instead of viewing one property you get a book to read of mostly useless, repeating info.

The previous Inspect panel would provide everything within a single view with no issues. Much worse than it has ever been.


In short, they want you to pay for that. They moved so many things that were previously available without additional cost to dev mode and started advertising dev mode.


I felt inspect styles plugin to be helpful. It also gives out svg code for svg icons.
https://www.figma.com/community/plugin/1254262542670221199/inspect-styles


notthatsamjones

Good tip! Helped me too.


Reply


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings