Is it possible to make a gradient and an image like this using penpot plus maybe the API

I am trying to automate making cover blog page images with gradients and a font in penpot using the penpot api. This is my first try in using penpot. I am design challenged and mostly do backends but now i have to make blog images and i like what they did on their website. I figure lets try it with penpot !

Maybe the first thing would be to try to make it manually. please suggest any similar image with gradients and lights like that you can think of.

Can someone please suggest how they would go about it ? any suggestion is greatly appreciated !!!

Hi,

the background is probably best done in a 3d software like Blender. However, you can find similar, free to use pattern on sites like pixabay. I quickly made this as an example:

1 Like

Hi! Everything is possible. Generally speaking, you can, although it depends on what you want to achieve. While Penpot still needs some improvements to facilitate this type of work (for example, allowing linear gradients to have multiple intermediate colors), here’s an approximation. I put this together quite quickly (10 min approx.). Made 100% with Penpot, here is the Penpot file.
Unkey.penpot (7.6 MB)

1 Like

I seriously cannot thank you folks enough for you what you did … this is super amazing work !!!

Can anyone please point me to an example of how i can automate creating images like these using the penpot APIs ? basically what i want is to be able to place different texts on top of the bottom image and maybe change the colors to grayscale.

Hopefully, someone can point you in the right direction for this, but I would actually suggest using another free and open source tool to batch create vector graphics: Inkscape.

I know you’re asking about Penpot, but there’s a pretty good tutorial series from the Creative Freedom Summit that details how to do batch create / automate graphics mail merge style (including changing colours and text) using Inkscape. Here it is:

Part 1

Part 2:

Blog post:

Plugin:

2 Likes

I would suggest to check this links, they are quite informative.

API Documentation Builtin API Documentation - Penpot
Related discussion Provide an API · penpot/penpot · Discussion #462 · GitHub
Integrating Penpot 4. Integration Guide
Example: GitHub - GBKS/bitcoin-ui-kit-penpot-api-test

cheers