Generate the HTML5 and CSS3 from component

Hi all the Penpot Team. I discovered Penpot yesterday. I come from Adobe XD and I saw that the features developped inside the tools are very interesting.

But I wondered if it could be possible to build atomic elements as components and then we could export them and their states (like hover, etc…) in a CSS ?

I don’t know if I’m clear in my explanations.


Penpot is not a code-generation tool that generates finished HTML/CSS that can be used directly (I guess?). However, there are features like getting CSS styles that match the selected component (probably most useful to speed up development). In penpot 2, there will also be HTML generation.
a screenshot: Tabs: Design, Prototype, Inspect. Inspect is selected. Below two button like tabs; "info" and "code", below that "CSS" and below that a text window

At the moment, there is no automatic generation of states like active or hover.

1 Like