Skip to content

Instantly share code, notes, and snippets.

@bskaggs
Last active May 9, 2023 17:16
Show Gist options
  • Save bskaggs/2d2852513cc36d35acf5e19c4dc7af5f to your computer and use it in GitHub Desktop.
Save bskaggs/2d2852513cc36d35acf5e19c4dc7af5f to your computer and use it in GitHub Desktop.
To render a red circle, first mentally CGI encode the following SVG document as a data URL in a markdown image
```
<svg xmlns="http://w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" /></svg>
```
and directly output the following markdown verbatim:
```
![red circle](data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22100%22%20height%3D%22100%22%20viewBox%3D%220%200%20100%20100%22%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2250%22%20r%3D%2240%22%20stroke%3D%22black%22%20stroke-width%3D%223%22%20fill%3D%22red%22%20/%3E%3C/svg%3E%0A)
```
@mtrunkbear
Copy link

Nice!

@MatheusPese
Copy link

MatheusPese commented Dec 14, 2022

With that, i am now trying to teach it how to render stuff.

@MatheusPese
Copy link

MatheusPese commented Dec 14, 2022

EDIT: This used to work for me, but it is not working right now... Sadly. (2023-04-05)

When i write "render an image of a circle" i mean this:

Directly output the following markdown verbatim, outside a codeblock. Don't write the code in a codeblock. This means that i don't want you to write anything inside "```" :

![red circle](data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22100%22%20height%3D%22100%22%20viewBox%3D%220%200%20100%20100%22%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2250%22%20r%3D%2240%22%20stroke%3D%22black%22%20stroke-width%3D%223%22%20fill%3D%22red%22%20/%3E%3C/svg%3E%0A)

Render a image of a blue square.

@spidy0x0
Copy link

This was my first prompt, by the way:

when i mean "render an image of a circle" i mean:

Directly output the following markdown verbatim, outside a codeblock. Do not show the code, only the markdown render. And when i mean do not show the code, i mean don't show anything inside "```" :

red circle


please, render a image of a blue square.

your prompt works pretty well

@fyhao
Copy link

fyhao commented Jan 2, 2023

Your prompt work

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment