Easy Icon/Background/Launch image generation with ...

SkrOYC · 03-23-2022 01:46 PM

Some time ago I took a look at this awesome idea from @Ratatosk

SVG launch image - Google Cloud Community

With some troubleshooting and GIMP trial and error, I managed to make an awesome and profesional launch image for the company I'm working for.

It looks good on any platform:

Now, I wondered about the fact that this wasn't easy for me as a newbie when it comes to SVG. Sure, I did it, but with some struggles.

Today, I want to give a simple trick on a step by step kind of tutorial for you to have the posibility to make a good launch image without the hassle.

You will need a Figma account and some copy and paste skills ;]

Step #1 - Figma log in and new file

Go to figma.com and log in.

Once there, go to "New design file"

You will be presented with a beautiful blank canvas.

Step #2 - basic layout

Create your layout based on a rectangular form.

You can type "R" on your keyboard or go to the top left and select the "Rectangle" tool.

Once there, draw a rectangle at the middle of the canvas, it doesn't matter the size, we will make it the right size later.

I told you, size doesn't matter

If you take a look at the right, there is a "Design" tab where we can change the width and height of the rectangle (that's going to be the base canvas of the launch image, the background).

Make sure to make it a size that will fit your needs.

This is something that will vary depending on the main usage that the app will have. If you app will be used just on desktop, make it 16:9. If it's going to be used on mobile, make it the other way around (or maybe larger by today's standars; 9:18).

If it's going to be on both, a square would sound like the middle ground, but we are going to follow the ratio proposed by @Ratatosk which, after taking a look at his file properties, it seems like 1.4:1, or 14:10, or 4.2:3 (it's a ratio, it doesn't matter the way I write it, but I hope you understand the point).

To make things simple, W: 1400 and H: 1000

Also, you may not like the grey background.

There is an awesome color picker down there on the "Fill" section. Also, if you know your HEX/RGB/RGBA color, you can put it there.

So, here is a simple squarish rectangle with a green color:

You may notice that the "Fill" section has a lot of other options rather than just a simple solid color, you can have a linear gradient or other stuff. Play with it.

Step #3 - Add your own thing

For this example, I'm going to keep it simple and add text.
There is an option for it on the top left or you can type "T" on your keyboard.

I'm gonna write "AppSheet is _________________".

On the right panel you will have options for font size and others.

Now, this is added as a new layer, there is a panel showing the layers at the left.

Here is mine:

Figma adds a name to it automatically. I suggest you to rename them on a meaningfull way like making "Rectangle 1" to "background" and the "AppS...." to "text-1" for example.

Now, select all the layers you have (you can do this by clicking them while holding the Ctrl/CMD key on your keyboard and click on any of the items to open the options.

Select "Group selection". You can also just do a Ctrl+G shortcut.

The Layers area will have a group instead of the individual layers, with the individual layers on it. You can rename this also to "appsheet-launch-image" for example.

Step #4 - Export it

Now to the interesting part. All of this Figma stuff was needed to get a vector svg. To do it, select the group on the left panel.

On the right one there is an "export" section.

Change the PNG (default) to SVG

After that, uncheck the "Show in exports" option that's on the "Fill" section. Then click on the three dots at the right of the (now) SVG and make sure it looks like this:

The important thing is "Include 'id' attribute". This wil add the name of the layers to the file.

After all of that, click on "Export appsheet-launch-image"!

Step #5 - Make it usable (from AppSheet's standpoint)

I found that AppSheet doesn't like this image even if we use @GreenFlux's method explained here

What I've found that works great is to convert it from svg to base64.

To do it, go to this cool site https://base64.guru/converter/encode/image/svg

There select the file you exported earlier.

On "Output format" select the second option:

And hit "Encode SVG to base64".

You will get a huge string. You need to copy all of it. Here is mine:

data&colon;image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQwMCIgaGVpZ2h0PSIxMDAwIiB2aWV3Qm94PSIwIDAgMTQwMCAxMDAwIiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8ZyBpZD0iYXBwc2hlZXQtbGF1bmNoLWltYWdlIj4KPHJlY3QgaWQ9ImJhY2tncm91bmQiIHdpZHRoPSIxNDAwIiBoZWlnaHQ9IjEwMDAiIGZpbGw9InVybCgjcGFpbnQwX2xpbmVhcl8zXzMpIi8+CjxwYXRoIGlkPSJ0ZXh0LTEiIGQ9Ik01MzYuNTggNDQwSDUzMy43ODRMNTQwLjA2NSA0MjIuNTQ1SDU0My4xMDhMNTQ5LjM4OSA0NDBINTQ2LjU5NEw1NDEuNjU5IDQyNS43MTZINTQxLjUyM0w1MzYuNTggNDQwWk01MzcuMDQ4IDQzMy4xNjVINTQ2LjExNlY0MzUuMzgxSDUzNy4wNDhWNDMzLjE2NVpNNTUxLjcwNSA0NDQuOTA5VjQyNi45MDlINTU0LjE5NFY0MjkuMDMxSDU1NC40MDdDNTU0LjU1NSA0MjguNzU5IDU1NC43NjggNDI4LjQ0MyA1NTUuMDQ2IDQyOC4wODVDNTU1LjMyNSA0MjcuNzI3IDU1NS43MTEgNDI3LjQxNSA1NTYuMjA1IDQyNy4xNDhDNTU2LjcgNDI2Ljg3NSA1NTcuMzUzIDQyNi43MzkgNTU4LjE2NSA0MjYuNzM5QzU1OS4yMjIgNDI2LjczOSA1NjAuMTY1IDQyNy4wMDYgNTYwLjk5NSA0MjcuNTRDNTYxLjgyNSA0MjguMDc0IDU2Mi40NzUgNDI4Ljg0NCA1NjIuOTQ3IDQyOS44NDlDNTYzLjQyNCA0MzAuODU1IDU2My42NjMgNDMyLjA2NSA1NjMuNjYzIDQzMy40OEM1NjMuNjYzIDQzNC44OTUgNTYzLjQyNyA0MzYuMTA4IDU2Mi45NTUgNDM3LjExOUM1NjIuNDg0IDQzOC4xMjUgNTYxLjgzNiA0MzguOTAxIDU2MS4wMTIgNDM5LjQ0NkM1NjAuMTg4IDQzOS45ODYgNTU5LjI0OCA0NDAuMjU2IDU1OC4xOTEgNDQwLjI1NkM1NTcuMzk2IDQ0MC4yNTYgNTU2Ljc0NSA0NDAuMTIyIDU1Ni4yMzkgNDM5Ljg1NUM1NTUuNzM5IDQzOS41ODggNTU1LjM0NyA0MzkuMjc2IDU1NS4wNjMgNDM4LjkxOEM1NTQuNzc5IDQzOC41NiA1NTQuNTYgNDM4LjI0MSA1NTQuNDA3IDQzNy45NjNINTU0LjI1NFY0NDQuOTA5SDU1MS43MDVaTTU1NC4yMDIgNDMzLjQ1NUM1NTQuMjAyIDQzNC4zNzUgNTU0LjMzNiA0MzUuMTgyIDU1NC42MDMgNDM1Ljg3NUM1NTQuODcgNDM2LjU2OCA1NTUuMjU2IDQzNy4xMTEgNTU1Ljc2MiA0MzcuNTAzQzU1Ni4yNjggNDM3Ljg4OSA1NTYuODg3IDQzOC4wODIgNTU3LjYyIDQzOC4wODJDNTU4LjM4MSA0MzguMDgyIDU1OS4wMTggNDM3Ljg4MSA1NTkuNTI5IDQzNy40NzdDNTYwLjA0IDQzNy4wNjggNTYwLjQyNyA0MzYuNTE0IDU2MC42ODggNDM1LjgxNUM1NjAuOTU1IDQzNS4xMTYgNTYxLjA4OSA0MzQuMzMgNTYxLjA4OSA0MzMuNDU1QzU2MS4wODkgNDMyLjU5MSA1NjAuOTU4IDQzMS44MTUgNTYwLjY5NyA0MzEuMTI4QzU2MC40NDEgNDMwLjQ0IDU2MC4wNTUgNDI5Ljg5OCA1NTkuNTM4IDQyOS41QzU1OS4wMjYgNDI5LjEwMiA1NTguMzg3IDQyOC45MDMgNTU3LjYyIDQyOC45MDNDNTU2Ljg4MSA0MjguOTAzIDU1Ni4yNTYgNDI5LjA5NCA1NTUuNzQ1IDQyOS40NzRDNTU1LjIzOSA0MjkuODU1IDU1NC44NTYgNDMwLjM4NiA1NTQuNTk0IDQzMS4wNjhDNTU0LjMzMyA0MzEuNzUgNTU0LjIwMiA0MzIuNTQ1IDU1NC4yMDIgNDMzLjQ1NVpNNTY2LjUxOCA0NDQuOTA5VjQyNi45MDlINTY5LjAwNlY0MjkuMDMxSDU2OS4yMTlDNTY5LjM2NyA0MjguNzU5IDU2OS41OCA0MjguNDQzIDU2OS44NTkgNDI4LjA4NUM1NzAuMTM3IDQyNy43MjcgNTcwLjUyMyA0MjcuNDE1IDU3MS4wMTggNDI3LjE0OEM1NzEuNTEyIDQyNi44NzUgNTcyLjE2NSA0MjYuNzM5IDU3Mi45NzggNDI2LjczOUM1NzQuMDM1IDQyNi43MzkgNTc0Ljk3OCA0MjcuMDA2IDU3NS44MDggNDI3LjU0QzU3Ni42MzcgNDI4LjA3NCA1NzcuMjg4IDQyOC44NDQgNTc3Ljc1OSA0MjkuODQ5QzU3OC4yMzcgNDMwLjg1NSA1NzguNDc1IDQzMi4wNjUgNTc4LjQ3NSA0MzMuNDhDNTc4LjQ3NSA0MzQuODk1IDU3OC4yMzkgNDM2LjEwOCA1NzcuNzY4IDQzNy4xMTlDNTc3LjI5NiA0MzguMTI1IDU3Ni42NDggNDM4LjkwMSA1NzUuODI1IDQzOS40NDZDNTc1LjAwMSA0MzkuOTg2IDU3NC4wNiA0NDAuMjU2IDU3My4wMDQgNDQwLjI1NkM1NzIuMjA4IDQ0MC4yNTYgNTcxLjU1OCA0NDAuMTIyIDU3MS4wNTIgNDM5Ljg1NUM1NzAuNTUyIDQzOS41ODggNTcwLjE2IDQzOS4yNzYgNTY5Ljg3NiA0MzguOTE4QzU2OS41OTIgNDM4LjU2IDU2OS4zNzMgNDM4LjI0MSA1NjkuMjE5IDQzNy45NjNINTY5LjA2NlY0NDQuOTA5SDU2Ni41MThaTTU2OS4wMTUgNDMzLjQ1NUM1NjkuMDE1IDQzNC4zNzUgNTY5LjE0OCA0MzUuMTgyIDU2OS40MTUgNDM1Ljg3NUM1NjkuNjgzIDQzNi41NjggNTcwLjA2OSA0MzcuMTExIDU3MC41NzUgNDM3LjUwM0M1NzEuMDggNDM3Ljg4OSA1NzEuNyA0MzguMDgyIDU3Mi40MzMgNDM4LjA4MkM1NzMuMTk0IDQzOC4wODIgNTczLjgzIDQzNy44ODEgNTc0LjM0MiA0MzcuNDc3QzU3NC44NTMgNDM3LjA2OCA1NzUuMjM5IDQzNi41MTQgNTc1LjUwMSA0MzUuODE1QzU3NS43NjggNDM1LjExNiA1NzUuOTAxIDQzNC4zMyA1NzUuOTAxIDQzMy40NTVDNTc1LjkwMSA0MzIuNTkxIDU3NS43NzEgNDMxLjgxNSA1NzUuNTA5IDQzMS4xMjhDNTc1LjI1NCA0MzAuNDQgNTc0Ljg2NyA0MjkuODk4IDU3NC4zNSA0MjkuNUM1NzMuODM5IDQyOS4xMDIgNTczLjIgNDI4LjkwMyA1NzIuNDMzIDQyOC45MDNDNTcxLjY5NCA0MjguOTAzIDU3MS4wNjkgNDI5LjA5NCA1NzAuNTU4IDQyOS40NzRDNTcwLjA1MiA0MjkuODU1IDU2OS42NjggNDMwLjM4NiA1NjkuNDA3IDQzMS4wNjhDNTY5LjE0NiA0MzEuNzUgNTY5LjAxNSA0MzIuNTQ1IDU2OS4wMTUgNDMzLjQ1NVpNNTkxLjA1NSA0MjcuMTMxQzU5MC45NjQgNDI2LjMyNCA1OTAuNTg5IDQyNS42OTkgNTg5LjkzIDQyNS4yNTZDNTg5LjI3MSA0MjQuODA3IDU4OC40NDEgNDI0LjU4MiA1ODcuNDQxIDQyNC41ODJDNTg2LjcyNSA0MjQuNTgyIDU4Ni4xMDYgNDI0LjY5NiA1ODUuNTgzIDQyNC45MjNDNTg1LjA2IDQyNS4xNDUgNTg0LjY1NCA0MjUuNDUyIDU4NC4zNjQgNDI1Ljg0NEM1ODQuMDggNDI2LjIzIDU4My45MzggNDI2LjY3IDU4My45MzggNDI3LjE2NUM1ODMuOTM4IDQyNy41OCA1ODQuMDM1IDQyNy45MzcgNTg0LjIyOCA0MjguMjM5QzU4NC40MjcgNDI4LjU0IDU4NC42ODUgNDI4Ljc5MyA1ODUuMDA0IDQyOC45OTdDNTg1LjMyNyA0MjkuMTk2IDU4NS42NzQgNDI5LjM2NCA1ODYuMDQzIDQyOS41QzU4Ni40MTMgNDI5LjYzMSA1ODYuNzY4IDQyOS43MzkgNTg3LjEwOSA0MjkuODI0TDU4OC44MTMgNDMwLjI2N0M1ODkuMzcgNDMwLjQwMyA1ODkuOTQxIDQzMC41ODggNTkwLjUyNiA0MzAuODIxQzU5MS4xMTIgNDMxLjA1NCA1OTEuNjU0IDQzMS4zNjEgNTkyLjE1NCA0MzEuNzQxQzU5Mi42NTQgNDMyLjEyMiA1OTMuMDU4IDQzMi41OTQgNTkzLjM2NCA0MzMuMTU2QzU5My42NzcgNDMzLjcxOSA1OTMuODMzIDQzNC4zOTIgNTkzLjgzMyA0MzUuMTc2QzU5My44MzMgNDM2LjE2NSA1OTMuNTc3IDQzNy4wNDMgNTkzLjA2NiA0MzcuODFDNTkyLjU2IDQzOC41NzcgNTkxLjgyNSA0MzkuMTgyIDU5MC44NTkgNDM5LjYyNUM1ODkuODk4IDQ0MC4wNjggNTg4LjczNyA0NDAuMjkgNTg3LjM3MyA0NDAuMjlDNTg2LjA2NiA0NDAuMjkgNTg0LjkzNSA0NDAuMDgyIDU4My45ODEgNDM5LjY2OEM1ODMuMDI2IDQzOS4yNTMgNTgyLjI3OSA0MzguNjY1IDU4MS43MzkgNDM3LjkwM0M1ODEuMiA0MzcuMTM2IDU4MC45MDEgNDM2LjIyNyA1ODAuODQ0IDQzNS4xNzZINTgzLjQ4N0M1ODMuNTM4IDQzNS44MDcgNTgzLjc0MiA0MzYuMzMyIDU4NC4xIDQzNi43NTNDNTg0LjQ2NCA0MzcuMTY4IDU4NC45MjcgNDM3LjQ3NyA1ODUuNDg5IDQzNy42ODJDNTg2LjA1OCA0MzcuODgxIDU4Ni42OCA0MzcuOTggNTg3LjM1NiA0MzcuOThDNTg4LjEgNDM3Ljk4IDU4OC43NjIgNDM3Ljg2NCA1ODkuMzQyIDQzNy42MzFDNTg5LjkyNyA0MzcuMzkyIDU5MC4zODcgNDM3LjA2MiA1OTAuNzIyIDQzNi42NDJDNTkxLjA1OCA0MzYuMjE2IDU5MS4yMjUgNDM1LjcxOSA1OTEuMjI1IDQzNS4xNTFDNTkxLjIyNSA0MzQuNjM0IDU5MS4wNzcgNDM0LjIxIDU5MC43ODIgNDMzLjg4MUM1OTAuNDkyIDQzMy41NTEgNTkwLjA5NyA0MzMuMjc4IDU4OS41OTcgNDMzLjA2MkM1ODkuMTAzIDQzMi44NDcgNTg4LjU0MyA0MzIuNjU2IDU4Ny45MTggNDMyLjQ5MUw1ODUuODU2IDQzMS45MjlDNTg0LjQ1OCA0MzEuNTQ4IDU4My4zNSA0MzAuOTg5IDU4Mi41MzIgNDMwLjI1QzU4MS43MTkgNDI5LjUxMSA1ODEuMzEzIDQyOC41MzQgNTgxLjMxMyA0MjcuMzE4QzU4MS4zMTMgNDI2LjMxMiA1ODEuNTg2IDQyNS40MzUgNTgyLjEzMSA0MjQuNjg1QzU4Mi42NzcgNDIzLjkzNSA1ODMuNDE1IDQyMy4zNTIgNTg0LjM0NyA0MjIuOTM4QzU4NS4yNzkgNDIyLjUxNyA1ODYuMzMgNDIyLjMwNyA1ODcuNTAxIDQyMi4zMDdDNTg4LjY4MyA0MjIuMzA3IDU4OS43MjUgNDIyLjUxNCA1OTAuNjI5IDQyMi45MjlDNTkxLjUzOCA0MjMuMzQ0IDU5Mi4yNTQgNDIzLjkxNSA1OTIuNzc2IDQyNC42NDJDNTkzLjI5OSA0MjUuMzY0IDU5My41NzIgNDI2LjE5MyA1OTMuNTk0IDQyNy4xMzFINTkxLjA1NVpNNTk5LjMyNCA0MzIuMjI3VjQ0MEg1OTYuNzc2VjQyMi41NDVINTk5LjI5VjQyOS4wNEg1OTkuNDUyQzU5OS43NTkgNDI4LjMzNSA2MDAuMjI3IDQyNy43NzYgNjAwLjg1OCA0MjcuMzYxQzYwMS40ODkgNDI2Ljk0NiA2MDIuMzEzIDQyNi43MzkgNjAzLjMzIDQyNi43MzlDNjA0LjIyNyA0MjYuNzM5IDYwNS4wMTEgNDI2LjkyMyA2MDUuNjgyIDQyNy4yOTNDNjA2LjM1OCA0MjcuNjYyIDYwNi44ODEgNDI4LjIxMyA2MDcuMjUgNDI4Ljk0NkM2MDcuNjI1IDQyOS42NzMgNjA3LjgxMiA0MzAuNTgyIDYwNy44MTIgNDMxLjY3M1Y0NDBINjA1LjI2NFY0MzEuOThDNjA1LjI2NCA0MzEuMDIgNjA1LjAxNyA0MzAuMjc2IDYwNC41MjMgNDI5Ljc0N0M2MDQuMDI4IDQyOS4yMTMgNjAzLjM0MSA0MjguOTQ2IDYwMi40NiA0MjguOTQ2QzYwMS44NTggNDI4Ljk0NiA2MDEuMzE4IDQyOS4wNzQgNjAwLjg0MSA0MjkuMzNDNjAwLjM2OSA0MjkuNTg1IDU5OS45OTcgNDI5Ljk2IDU5OS43MjQgNDMwLjQ1NUM1OTkuNDU3IDQzMC45NDMgNTk5LjMyNCA0MzEuNTM0IDU5OS4zMjQgNDMyLjIyN1pNNjE2Ljg1NSA0NDAuMjY0QzYxNS41NjUgNDQwLjI2NCA2MTQuNDU1IDQzOS45ODkgNjEzLjUyMyA0MzkuNDM4QzYxMi41OTcgNDM4Ljg4MSA2MTEuODgxIDQzOC4wOTkgNjExLjM3NSA0MzcuMDk0QzYxMC44NzUgNDM2LjA4MiA2MTAuNjI1IDQzNC44OTggNjEwLjYyNSA0MzMuNTRDNjEwLjYyNSA0MzIuMTk5IDYxMC44NzUgNDMxLjAxNyA2MTEuMzc1IDQyOS45OTRDNjExLjg4MSA0MjguOTcyIDYxMi41ODUgNDI4LjE3MyA2MTMuNDg5IDQyNy41OTlDNjE0LjM5OCA0MjcuMDI2IDYxNS40NiA0MjYuNzM5IDYxNi42NzYgNDI2LjczOUM2MTcuNDE1IDQyNi43MzkgNjE4LjEzMSA0MjYuODYxIDYxOC44MjQgNDI3LjEwNUM2MTkuNTE3IDQyNy4zNDkgNjIwLjEzOSA0MjcuNzMzIDYyMC42OSA0MjguMjU2QzYyMS4yNDEgNDI4Ljc3OCA2MjEuNjc2IDQyOS40NTcgNjIxLjk5NCA0MzAuMjkzQzYyMi4zMTMgNDMxLjEyMiA2MjIuNDcyIDQzMi4xMzEgNjIyLjQ3MiA0MzMuMzE4VjQzNC4yMjJINjEyLjA2NVY0MzIuMzEySDYxOS45NzRDNjE5Ljk3NCA0MzEuNjQyIDYxOS44MzggNDMxLjA0OCA2MTkuNTY1IDQzMC41MzFDNjE5LjI5MyA0MzAuMDA5IDYxOC45MDkgNDI5LjU5NyA2MTguNDE1IDQyOS4yOTVDNjE3LjkyNiA0MjguOTk0IDYxNy4zNTIgNDI4Ljg0NCA2MTYuNjkzIDQyOC44NDRDNjE1Ljk3NyA0MjguODQ0IDYxNS4zNTIgNDI5LjAyIDYxNC44MTggNDI5LjM3MkM2MTQuMjkgNDI5LjcxOSA2MTMuODgxIDQzMC4xNzMgNjEzLjU5MSA0MzAuNzM2QzYxMy4zMDcgNDMxLjI5MyA2MTMuMTY1IDQzMS44OTggNjEzLjE2NSA0MzIuNTUxVjQzNC4wNDNDNjEzLjE2NSA0MzQuOTE4IDYxMy4zMTggNDM1LjY2MiA2MTMuNjI1IDQzNi4yNzZDNjEzLjkzOCA0MzYuODg5IDYxNC4zNzIgNDM3LjM1OCA2MTQuOTI5IDQzNy42ODJDNjE1LjQ4NiA0MzggNjE2LjEzNiA0MzguMTU5IDYxNi44ODEgNDM4LjE1OUM2MTcuMzY0IDQzOC4xNTkgNjE3LjgwNCA0MzguMDkxIDYxOC4yMDIgNDM3Ljk1NUM2MTguNTk5IDQzNy44MTIgNjE4Ljk0MyA0MzcuNjAyIDYxOS4yMzMgNDM3LjMyNEM2MTkuNTIzIDQzNy4wNDUgNjE5Ljc0NCA0MzYuNzAyIDYxOS44OTggNDM2LjI5M0w2MjIuMzEgNDM2LjcyN0M2MjIuMTE2IDQzNy40MzcgNjIxLjc3IDQzOC4wNiA2MjEuMjcgNDM4LjU5NEM2MjAuNzc2IDQzOS4xMjIgNjIwLjE1MyA0MzkuNTM0IDYxOS40MDMgNDM5LjgzQzYxOC42NTkgNDQwLjExOSA2MTcuODEgNDQwLjI2NCA2MTYuODU1IDQ0MC4yNjRaTTYzMC45NDEgNDQwLjI2NEM2MjkuNjUxIDQ0MC4yNjQgNjI4LjU0IDQzOS45ODkgNjI3LjYwOSA0MzkuNDM4QzYyNi42ODMgNDM4Ljg4MSA2MjUuOTY3IDQzOC4wOTkgNjI1LjQ2MSA0MzcuMDk0QzYyNC45NjEgNDM2LjA4MiA2MjQuNzExIDQzNC44OTggNjI0LjcxMSA0MzMuNTRDNjI0LjcxMSA0MzIuMTk5IDYyNC45NjEgNDMxLjAxNyA2MjUuNDYxIDQyOS45OTRDNjI1Ljk2NyA0MjguOTcyIDYyNi42NzEgNDI4LjE3MyA2MjcuNTc1IDQyNy41OTlDNjI4LjQ4NCA0MjcuMDI2IDYyOS41NDYgNDI2LjczOSA2MzAuNzYyIDQyNi43MzlDNjMxLjUwMSA0MjYuNzM5IDYzMi4yMTcgNDI2Ljg2MSA2MzIuOTEgNDI3LjEwNUM2MzMuNjAzIDQyNy4zNDkgNjM0LjIyNSA0MjcuNzMzIDYzNC43NzYgNDI4LjI1NkM2MzUuMzI3IDQyOC43NzggNjM1Ljc2MiA0MjkuNDU3IDYzNi4wOCA0MzAuMjkzQzYzNi4zOTggNDMxLjEyMiA2MzYuNTU4IDQzMi4xMzEgNjM2LjU1OCA0MzMuMzE4VjQzNC4yMjJINjI2LjE1MVY0MzIuMzEySDYzNC4wNkM2MzQuMDYgNDMxLjY0MiA2MzMuOTI0IDQzMS4wNDggNjMzLjY1MSA0MzAuNTMxQzYzMy4zNzkgNDMwLjAwOSA2MzIuOTk1IDQyOS41OTcgNjMyLjUwMSA0MjkuMjk1QzYzMi4wMTIgNDI4Ljk5NCA2MzEuNDM4IDQyOC44NDQgNjMwLjc3OSA0MjguODQ0QzYzMC4wNjMgNDI4Ljg0NCA2MjkuNDM4IDQyOS4wMiA2MjguOTA0IDQyOS4zNzJDNjI4LjM3NiA0MjkuNzE5IDYyNy45NjcgNDMwLjE3MyA2MjcuNjc3IDQzMC43MzZDNjI3LjM5MyA0MzEuMjkzIDYyNy4yNTEgNDMxLjg5OCA2MjcuMjUxIDQzMi41NTFWNDM0LjA0M0M2MjcuMjUxIDQzNC45MTggNjI3LjQwNCA0MzUuNjYyIDYyNy43MTEgNDM2LjI3NkM2MjguMDIzIDQzNi44ODkgNjI4LjQ1OCA0MzcuMzU4IDYyOS4wMTUgNDM3LjY4MkM2MjkuNTcyIDQzOCA2MzAuMjIyIDQzOC4xNTkgNjMwLjk2NyA0MzguMTU5QzYzMS40NSA0MzguMTU5IDYzMS44OSA0MzguMDkxIDYzMi4yODggNDM3Ljk1NUM2MzIuNjg1IDQzNy44MTIgNjMzLjAyOSA0MzcuNjAyIDYzMy4zMTkgNDM3LjMyNEM2MzMuNjA5IDQzNy4wNDUgNjMzLjgzIDQzNi43MDIgNjMzLjk4NCA0MzYuMjkzTDYzNi4zOTYgNDM2LjcyN0M2MzYuMjAyIDQzNy40MzcgNjM1Ljg1NiA0MzguMDYgNjM1LjM1NiA0MzguNTk0QzYzNC44NjIgNDM5LjEyMiA2MzQuMjM5IDQzOS41MzQgNjMzLjQ4OSA0MzkuODNDNjMyLjc0NSA0NDAuMTE5IDYzMS44OTYgNDQwLjI2NCA2MzAuOTQxIDQ0MC4yNjRaTTY0NS40OTYgNDI2LjkwOVY0MjguOTU1SDYzOC4zNDVWNDI2LjkwOUg2NDUuNDk2Wk02NDAuMjYzIDQyMy43NzNINjQyLjgxMVY0MzYuMTU2QzY0Mi44MTEgNDM2LjY1MSA2NDIuODg1IDQzNy4wMjMgNjQzLjAzMyA0MzcuMjczQzY0My4xOCA0MzcuNTE3IDY0My4zNzEgNDM3LjY4NSA2NDMuNjA0IDQzNy43NzZDNjQzLjg0MiA0MzcuODYxIDY0NC4xMDEgNDM3LjkwMyA2NDQuMzc5IDQzNy45MDNDNjQ0LjU4NCA0MzcuOTAzIDY0NC43NjMgNDM3Ljg4OSA2NDQuOTE2IDQzNy44NjFDNjQ1LjA3IDQzNy44MzIgNjQ1LjE4OSA0MzcuODEgNjQ1LjI3NCA0MzcuNzkzTDY0NS43MzQgNDM5Ljg5OEM2NDUuNTg3IDQzOS45NTUgNjQ1LjM3NiA0NDAuMDExIDY0NS4xMDQgNDQwLjA2OEM2NDQuODMxIDQ0MC4xMzEgNjQ0LjQ5IDQ0MC4xNjUgNjQ0LjA4MSA0NDAuMTdDNjQzLjQxMSA0NDAuMTgyIDY0Mi43ODYgNDQwLjA2MiA2NDIuMjA2IDQzOS44MTJDNjQxLjYyNiA0MzkuNTYyIDY0MS4xNTggNDM5LjE3NiA2NDAuOCA0MzguNjUzQzY0MC40NDIgNDM4LjEzMSA2NDAuMjYzIDQzNy40NzQgNjQwLjI2MyA0MzYuNjg1VjQyMy43NzNaTTY1NC42NjYgNDQwVjQyNi45MDlINjU3LjIxNFY0NDBINjU0LjY2NlpNNjU1Ljk1MyA0MjQuODg5QzY1NS41MSA0MjQuODg5IDY1NS4xMjkgNDI0Ljc0MSA2NTQuODExIDQyNC40NDZDNjU0LjQ5OSA0MjQuMTQ1IDY1NC4zNDIgNDIzLjc4NyA2NTQuMzQyIDQyMy4zNzJDNjU0LjM0MiA0MjIuOTUyIDY1NC40OTkgNDIyLjU5NCA2NTQuODExIDQyMi4yOThDNjU1LjEyOSA0MjEuOTk3IDY1NS41MSA0MjEuODQ3IDY1NS45NTMgNDIxLjg0N0M2NTYuMzk2IDQyMS44NDcgNjU2Ljc3NCA0MjEuOTk3IDY1Ny4wODcgNDIyLjI5OEM2NTcuNDA1IDQyMi41OTQgNjU3LjU2NCA0MjIuOTUyIDY1Ny41NjQgNDIzLjM3MkM2NTcuNTY0IDQyMy43ODcgNjU3LjQwNSA0MjQuMTQ1IDY1Ny4wODcgNDI0LjQ0NkM2NTYuNzc0IDQyNC43NDEgNjU2LjM5NiA0MjQuODg5IDY1NS45NTMgNDI0Ljg4OVpNNjcwLjQ1MiA0MzAuMTA1TDY2OC4xNDMgNDMwLjUxNEM2NjguMDQ2IDQzMC4yMTkgNjY3Ljg5MyA0MjkuOTM3IDY2Ny42ODMgNDI5LjY3QzY2Ny40NzggNDI5LjQwMyA2NjcuMiA0MjkuMTg1IDY2Ni44NDcgNDI5LjAxNEM2NjYuNDk1IDQyOC44NDQgNjY2LjA1NSA0MjguNzU5IDY2NS41MjYgNDI4Ljc1OUM2NjQuODA1IDQyOC43NTkgNjY0LjIwMiA0MjguOTIgNjYzLjcxOSA0MjkuMjQ0QzY2My4yMzcgNDI5LjU2MiA2NjIuOTk1IDQyOS45NzQgNjYyLjk5NSA0MzAuNDhDNjYyLjk5NSA0MzAuOTE4IDY2My4xNTcgNDMxLjI3IDY2My40ODEgNDMxLjUzN0M2NjMuODA1IDQzMS44MDQgNjY0LjMyNyA0MzIuMDIzIDY2NS4wNDkgNDMyLjE5M0w2NjcuMTI5IDQzMi42N0M2NjguMzMzIDQzMi45NDkgNjY5LjIzMSA0MzMuMzc4IDY2OS44MjIgNDMzLjk1N0M2NzAuNDEzIDQzNC41MzcgNjcwLjcwOCA0MzUuMjkgNjcwLjcwOCA0MzYuMjE2QzY3MC43MDggNDM3IDY3MC40ODEgNDM3LjY5OSA2NzAuMDI2IDQzOC4zMTJDNjY5LjU3NyA0MzguOTIgNjY4Ljk1IDQzOS4zOTggNjY4LjE0MyA0MzkuNzQ0QzY2Ny4zNDIgNDQwLjA5MSA2NjYuNDEzIDQ0MC4yNjQgNjY1LjM1NiA0NDAuMjY0QzY2My44OSA0NDAuMjY0IDY2Mi42OTQgNDM5Ljk1MiA2NjEuNzY4IDQzOS4zMjdDNjYwLjg0MiA0MzguNjk2IDY2MC4yNzMgNDM3LjgwMSA2NjAuMDYzIDQzNi42NDJMNjYyLjUyNiA0MzYuMjY3QzY2Mi42OCA0MzYuOTA5IDY2Mi45OTUgNDM3LjM5NSA2NjMuNDcyIDQzNy43MjRDNjYzLjk1IDQzOC4wNDggNjY0LjU3MiA0MzguMjEgNjY1LjMzOSA0MzguMjFDNjY2LjE3NCA0MzguMjEgNjY2Ljg0MiA0MzguMDM3IDY2Ny4zNDIgNDM3LjY5QzY2Ny44NDIgNDM3LjMzOCA2NjguMDkyIDQzNi45MDkgNjY4LjA5MiA0MzYuNDAzQzY2OC4wOTIgNDM1Ljk5NCA2NjcuOTM4IDQzNS42NTEgNjY3LjYzMSA0MzUuMzcyQzY2Ny4zMyA0MzUuMDk0IDY2Ni44NjcgNDM0Ljg4NCA2NjYuMjQyIDQzNC43NDFMNjY0LjAyNiA0MzQuMjU2QzY2Mi44MDUgNDMzLjk3NyA2NjEuOTAxIDQzMy41MzQgNjYxLjMxNiA0MzIuOTI2QzY2MC43MzcgNDMyLjMxOCA2NjAuNDQ3IDQzMS41NDggNjYwLjQ0NyA0MzAuNjE2QzY2MC40NDcgNDI5Ljg0NCA2NjAuNjYzIDQyOS4xNjggNjYxLjA5NCA0MjguNTg4QzY2MS41MjYgNDI4LjAwOSA2NjIuMTIzIDQyNy41NTcgNjYyLjg4NCA0MjcuMjMzQzY2My42NDYgNDI2LjkwMyA2NjQuNTE4IDQyNi43MzkgNjY1LjUwMSA0MjYuNzM5QzY2Ni45MTUgNDI2LjczOSA2NjguMDI5IDQyNy4wNDUgNjY4Ljg0MiA0MjcuNjU5QzY2OS42NTQgNDI4LjI2NyA2NzAuMTkxIDQyOS4wODIgNjcwLjQ1MiA0MzAuMTA1Wk02ODkuMjExIDQ0MFY0NDIuMTY1SDY3OC4xMjNWNDQwSDY4OS4yMTFaTTcwMC4yNSA0NDBWNDQyLjE2NUg2ODkuMTYyVjQ0MEg3MDAuMjVaTTcxMS4yODkgNDQwVjQ0Mi4xNjVINzAwLjIwMVY0NDBINzExLjI4OVpNNzIyLjMyOCA0NDBWNDQyLjE2NUg3MTEuMjRWNDQwSDcyMi4zMjhaTTczMy4zNjcgNDQwVjQ0Mi4xNjVINzIyLjI3OVY0NDBINzMzLjM2N1pNNzQ0LjQwNiA0NDBWNDQyLjE2NUg3MzMuMzE4VjQ0MEg3NDQuNDA2Wk03NTUuNDQ1IDQ0MFY0NDIuMTY1SDc0NC4zNTdWNDQwSDc1NS40NDVaTTc2Ni40ODQgNDQwVjQ0Mi4xNjVINzU1LjM5NlY0NDBINzY2LjQ4NFpNNzc3LjUyMyA0NDBWNDQyLjE2NUg3NjYuNDM1VjQ0MEg3NzcuNTIzWk03ODguNTYyIDQ0MFY0NDIuMTY1SDc3Ny40NzRWNDQwSDc4OC41NjJaTTc5OS42MDIgNDQwVjQ0Mi4xNjVINzg4LjUxM1Y0NDBINzk5LjYwMlpNODEwLjY0MSA0NDBWNDQyLjE2NUg3OTkuNTUzVjQ0MEg4MTAuNjQxWk04MjEuNjggNDQwVjQ0Mi4xNjVIODEwLjU5MlY0NDBIODIxLjY4Wk04MzIuNzE5IDQ0MFY0NDIuMTY1SDgyMS42MzFWNDQwSDgzMi43MTlaTTg0My43NTggNDQwVjQ0Mi4xNjVIODMyLjY3VjQ0MEg4NDMuNzU4Wk04NTQuNzk3IDQ0MFY0NDIuMTY1SDg0My43MDlWNDQwSDg1NC43OTdaTTg2NS44MzYgNDQwVjQ0Mi4xNjVIODU0Ljc0OFY0NDBIODY1LjgzNloiIGZpbGw9ImJsYWNrIi8+CjwvZz4KPGRlZnM+CjxsaW5lYXJHcmFkaWVudCBpZD0icGFpbnQwX2xpbmVhcl8zXzMiIHgxPSIxNDAwIiB5MT0iNS44NDEyNWUtMDUiIHgyPSI1LjUwODM4ZS0wNSIgeTI9Ijk5MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiPgo8c3RvcCBzdG9wLWNvbG9yPSIjMTA5NjM1Ii8+CjxzdG9wIG9mZnNldD0iMC41NDA2NjEiIHN0b3AtY29sb3I9IiMxMDk2MzUiIHN0b3Atb3BhY2l0eT0iMC42MTk3OTIiLz4KPHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjMTI5QTM4IiBzdG9wLW9wYWNpdHk9IjAiLz4KPC9saW5lYXJHcmFkaWVudD4KPC9kZWZzPgo8L3N2Zz4K

data&colon;image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQwMCIgaGVpZ2h0PSIxMDAwIiB2aWV3Qm94PSIwIDAgMTQwMCAxMDAwIiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8ZyBpZD0iYXBwc2hlZXQtbGF1bmNoLWltYWdlIj4KPHJlY3QgaWQ9ImJhY2tncm91bmQiIHdpZHRoPSIxNDAwIiBoZWlnaHQ9IjEwMDAiIGZpbGw9InVybCgjcGFpbnQwX2xpbmVhcl8zXzMpIi8+CjxwYXRoIGlkPSJ0ZXh0LTEiIGQ9Ik01MzYuNTggNDQwSDUzMy43ODRMNTQwLjA2NSA0MjIuNTQ1SDU0My4xMDhMNTQ5LjM4OSA0NDBINTQ2LjU5NEw1NDEuNjU5IDQyNS43MTZINTQxLjUyM0w1MzYuNTggNDQwWk01MzcuMDQ4IDQzMy4xNjVINTQ2LjExNlY0MzUuMzgxSDUzNy4wNDhWNDMzLjE2NVpNNTUxLjcwNSA0NDQuOTA5VjQyNi45MDlINTU0LjE5NFY0MjkuMDMxSDU1NC40MDdDNTU0LjU1NSA0MjguNzU5IDU1NC43NjggNDI4LjQ0MyA1NTUuMDQ2IDQyOC4wODVDNTU1LjMyNSA0MjcuNzI3IDU1NS43MTEgNDI3LjQxNSA1NTYuMjA1IDQyNy4xNDhDNTU2LjcgNDI2Ljg3NSA1NTcuMzUzIDQyNi43MzkgNTU4LjE2NSA0MjYuNzM5QzU1OS4yMjIgNDI2LjczOSA1NjAuMTY1IDQyNy4wMDYgNTYwLjk5NSA0MjcuNTRDNTYxLjgyNSA0MjguMDc0IDU2Mi40NzUgNDI4Ljg0NCA1NjIuOTQ3IDQyOS44NDlDNTYzLjQyNCA0MzAuODU1IDU2My42NjMgNDMyLjA2NSA1NjMuNjYzIDQzMy40OEM1NjMuNjYzIDQzNC44OTUgNTYzLjQyNyA0MzYuMTA4IDU2Mi45NTUgNDM3LjExOUM1NjIuNDg0IDQzOC4xMjUgNTYxLjgzNiA0MzguOTAxIDU2MS4wMTIgNDM5LjQ0NkM1NjAuMTg4IDQzOS45ODYgNTU5LjI0OCA0NDAuMjU2IDU1OC4xOTEgNDQwLjI1NkM1NTcuMzk2IDQ0MC4yNTYgNTU2Ljc0NSA0NDAuMTIyIDU1Ni4yMzkgNDM5Ljg1NUM1NTUuNzM5IDQzOS41ODggNTU1LjM0NyA0MzkuMjc2IDU1NS4wNjMgNDM4LjkxOEM1NTQuNzc5IDQzOC41NiA1NTQuNTYgNDM4LjI0MSA1NTQuNDA3IDQzNy45NjNINTU0LjI1NFY0NDQuOTA5SDU1MS43MDVaTTU1NC4yMDIgNDMzLjQ1NUM1NTQuMjAyIDQzNC4zNzUgNTU0LjMzNiA0MzUuMTgyIDU1NC42MDMgNDM1Ljg3NUM1NTQuODcgNDM2LjU2OCA1NTUuMjU2IDQzNy4xMTEgNTU1Ljc2MiA0MzcuNTAzQzU1Ni4yNjggNDM3Ljg4OSA1NTYuODg3IDQzOC4wODIgNTU3LjYyIDQzOC4wODJDNTU4LjM4MSA0MzguMDgyIDU1OS4wMTggNDM3Ljg4MSA1NTkuNTI5IDQzNy40NzdDNTYwLjA0IDQzNy4wNjggNTYwLjQyNyA0MzYuNTE0IDU2MC42ODggNDM1LjgxNUM1NjAuOTU1IDQzNS4xMTYgNTYxLjA4OSA0MzQuMzMgNTYxLjA4OSA0MzMuNDU1QzU2MS4wODkgNDMyLjU5MSA1NjAuOTU4IDQzMS44MTUgNTYwLjY5NyA0MzEuMTI4QzU2MC40NDEgNDMwLjQ0IDU2MC4wNTUgNDI5Ljg5OCA1NTkuNTM4IDQyOS41QzU1OS4wMjYgNDI5LjEwMiA1NTguMzg3IDQyOC45MDMgNTU3LjYyIDQyOC45MDNDNTU2Ljg4MSA0MjguOTAzIDU1Ni4yNTYgNDI5LjA5NCA1NTUuNzQ1IDQyOS40NzRDNTU1LjIzOSA0MjkuODU1IDU1NC44NTYgNDMwLjM4NiA1NTQuNTk0IDQzMS4wNjhDNTU0LjMzMyA0MzEuNzUgNTU0LjIwMiA0MzIuNTQ1IDU1NC4yMDIgNDMzLjQ1NVpNNTY2LjUxOCA0NDQuOTA5VjQyNi45MDlINTY5LjAwNlY0MjkuMDMxSDU2OS4yMTlDNTY5LjM2NyA0MjguNzU5IDU2OS41OCA0MjguNDQzIDU2OS44NTkgNDI4LjA4NUM1NzAuMTM3IDQyNy43MjcgNTcwLjUyMyA0MjcuNDE1IDU3MS4wMTggNDI3LjE0OEM1NzEuNTEyIDQyNi44NzUgNTcyLjE2NSA0MjYuNzM5IDU3Mi45NzggNDI2LjczOUM1NzQuMDM1IDQyNi43MzkgNTc0Ljk3OCA0MjcuMDA2IDU3NS44MDggNDI3LjU0QzU3Ni42MzcgNDI4LjA3NCA1NzcuMjg4IDQyOC44NDQgNTc3Ljc1OSA0MjkuODQ5QzU3OC4yMzcgNDMwLjg1NSA1NzguNDc1IDQzMi4wNjUgNTc4LjQ3NSA0MzMuNDhDNTc4LjQ3NSA0MzQuODk1IDU3OC4yMzkgNDM2LjEwOCA1NzcuNzY4IDQzNy4xMTlDNTc3LjI5NiA0MzguMTI1IDU3Ni42NDggNDM4LjkwMSA1NzUuODI1IDQzOS40NDZDNTc1LjAwMSA0MzkuOTg2IDU3NC4wNiA0NDAuMjU2IDU3My4wMDQgNDQwLjI1NkM1NzIuMjA4IDQ0MC4yNTYgNTcxLjU1OCA0NDAuMTIyIDU3MS4wNTIgNDM5Ljg1NUM1NzAuNTUyIDQzOS41ODggNTcwLjE2IDQzOS4yNzYgNTY5Ljg3NiA0MzguOTE4QzU2OS41OTIgNDM4LjU2IDU2OS4zNzMgNDM4LjI0MSA1NjkuMjE5IDQzNy45NjNINTY5LjA2NlY0NDQuOTA5SDU2Ni41MThaTTU2OS4wMTUgNDMzLjQ1NUM1NjkuMDE1IDQzNC4zNzUgNTY5LjE0OCA0MzUuMTgyIDU2OS40MTUgNDM1Ljg3NUM1NjkuNjgzIDQzNi41NjggNTcwLjA2OSA0MzcuMTExIDU3MC41NzUgNDM3LjUwM0M1NzEuMDggNDM3Ljg4OSA1NzEuNyA0MzguMDgyIDU3Mi40MzMgNDM4LjA4MkM1NzMuMTk0IDQzOC4wODIgNTczLjgzIDQzNy44ODEgNTc0LjM0MiA0MzcuNDc3QzU3NC44NTMgNDM3LjA2OCA1NzUuMjM5IDQzNi41MTQgNTc1LjUwMSA0MzUuODE1QzU3NS43NjggNDM1LjExNiA1NzUuOTAxIDQzNC4zMyA1NzUuOTAxIDQzMy40NTVDNTc1LjkwMSA0MzIuNTkxIDU3NS43NzEgNDMxLjgxNSA1NzUuNTA5IDQzMS4xMjhDNTc1LjI1NCA0MzAuNDQgNTc0Ljg2NyA0MjkuODk4IDU3NC4zNSA0MjkuNUM1NzMuODM5IDQyOS4xMDIgNTczLjIgNDI4LjkwMyA1NzIuNDMzIDQyOC45MDNDNTcxLjY5NCA0MjguOTAzIDU3MS4wNjkgNDI5LjA5NCA1NzAuNTU4IDQyOS40NzRDNTcwLjA1MiA0MjkuODU1IDU2OS42NjggNDMwLjM4NiA1NjkuNDA3IDQzMS4wNjhDNTY5LjE0NiA0MzEuNzUgNTY5LjAxNSA0MzIuNTQ1IDU2OS4wMTUgNDMzLjQ1NVpNNTkxLjA1NSA0MjcuMTMxQzU5MC45NjQgNDI2LjMyNCA1OTAuNTg5IDQyNS42OTkgNTg5LjkzIDQyNS4yNTZDNTg5LjI3MSA0MjQuODA3IDU4OC40NDEgNDI0LjU4MiA1ODcuNDQxIDQyNC41ODJDNTg2LjcyNSA0MjQuNTgyIDU4Ni4xMDYgNDI0LjY5NiA1ODUuNTgzIDQyNC45MjNDNTg1LjA2IDQyNS4xNDUgNTg0LjY1NCA0MjUuNDUyIDU4NC4zNjQgNDI1Ljg0NEM1ODQuMDggNDI2LjIzIDU4My45MzggNDI2LjY3IDU4My45MzggNDI3LjE2NUM1ODMuOTM4IDQyNy41OCA1ODQuMDM1IDQyNy45MzcgNTg0LjIyOCA0MjguMjM5QzU4NC40MjcgNDI4LjU0IDU4NC42ODUgNDI4Ljc5MyA1ODUuMDA0IDQyOC45OTdDNTg1LjMyNyA0MjkuMTk2IDU4NS42NzQgNDI5LjM2NCA1ODYuMDQzIDQyOS41QzU4Ni40MTMgNDI5LjYzMSA1ODYuNzY4IDQyOS43MzkgNTg3LjEwOSA0MjkuODI0TDU4OC44MTMgNDMwLjI2N0M1ODkuMzcgNDMwLjQwMyA1ODkuOTQxIDQzMC41ODggNTkwLjUyNiA0MzAuODIxQzU5MS4xMTIgNDMxLjA1NCA1OTEuNjU0IDQzMS4zNjEgNTkyLjE1NCA0MzEuNzQxQzU5Mi42NTQgNDMyLjEyMiA1OTMuMDU4IDQzMi41OTQgNTkzLjM2NCA0MzMuMTU2QzU5My42NzcgNDMzLjcxOSA1OTMuODMzIDQzNC4zOTIgNTkzLjgzMyA0MzUuMTc2QzU5My44MzMgNDM2LjE2NSA1OTMuNTc3IDQzNy4wNDMgNTkzLjA2NiA0MzcuODFDNTkyLjU2IDQzOC41NzcgNTkxLjgyNSA0MzkuMTgyIDU5MC44NTkgNDM5LjYyNUM1ODkuODk4IDQ0MC4wNjggNTg4LjczNyA0NDAuMjkgNTg3LjM3MyA0NDAuMjlDNTg2LjA2NiA0NDAuMjkgNTg0LjkzNSA0NDAuMDgyIDU4My45ODEgNDM5LjY2OEM1ODMuMDI2IDQzOS4yNTMgNTgyLjI3OSA0MzguNjY1IDU4MS43MzkgNDM3LjkwM0M1ODEuMiA0MzcuMTM2IDU4MC45MDEgNDM2LjIyNyA1ODAuODQ0IDQzNS4xNzZINTgzLjQ4N0M1ODMuNTM4IDQzNS44MDcgNTgzLjc0MiA0MzYuMzMyIDU4NC4xIDQzNi43NTNDNTg0LjQ2NCA0MzcuMTY4IDU4NC45MjcgNDM3LjQ3NyA1ODUuNDg5IDQzNy42ODJDNTg2LjA1OCA0MzcuODgxIDU4Ni42OCA0MzcuOTggNTg3LjM1NiA0MzcuOThDNTg4LjEgNDM3Ljk4IDU4OC43NjIgNDM3Ljg2NCA1ODkuMzQyIDQzNy42MzFDNTg5LjkyNyA0MzcuMzkyIDU5MC4zODcgNDM3LjA2MiA1OTAuNzIyIDQzNi42NDJDNTkxLjA1OCA0MzYuMjE2IDU5MS4yMjUgNDM1LjcxOSA1OTEuMjI1IDQzNS4xNTFDNTkxLjIyNSA0MzQuNjM0IDU5MS4wNzcgNDM0LjIxIDU5MC43ODIgNDMzLjg4MUM1OTAuNDkyIDQzMy41NTEgNTkwLjA5NyA0MzMuMjc4IDU4OS41OTcgNDMzLjA2MkM1ODkuMTAzIDQzMi44NDcgNTg4LjU0MyA0MzIuNjU2IDU4Ny45MTggNDMyLjQ5MUw1ODUuODU2IDQzMS45MjlDNTg0LjQ1OCA0MzEuNTQ4IDU4My4zNSA0MzAuOTg5IDU4Mi41MzIgNDMwLjI1QzU4MS43MTkgNDI5LjUxMSA1ODEuMzEzIDQyOC41MzQgNTgxLjMxMyA0MjcuMzE4QzU4MS4zMTMgNDI2LjMxMiA1ODEuNTg2IDQyNS40MzUgNTgyLjEzMSA0MjQuNjg1QzU4Mi42NzcgNDIzLjkzNSA1ODMuNDE1IDQyMy4zNTIgNTg0LjM0NyA0MjIuOTM4QzU4NS4yNzkgNDIyLjUxNyA1ODYuMzMgNDIyLjMwNyA1ODcuNTAxIDQyMi4zMDdDNTg4LjY4MyA0MjIuMzA3IDU4OS43MjUgNDIyLjUxNCA1OTAuNjI5IDQyMi45MjlDNTkxLjUzOCA0MjMuMzQ0IDU5Mi4yNTQgNDIzLjkxNSA1OTIuNzc2IDQyNC42NDJDNTkzLjI5OSA0MjUuMzY0IDU5My41NzIgNDI2LjE5MyA1OTMuNTk0IDQyNy4xMzFINTkxLjA1NVpNNTk5LjMyNCA0MzIuMjI3VjQ0MEg1OTYuNzc2VjQyMi41NDVINTk5LjI5VjQyOS4wNEg1OTkuNDUyQzU5OS43NTkgNDI4LjMzNSA2MDAuMjI3IDQyNy43NzYgNjAwLjg1OCA0MjcuMzYxQzYwMS40ODkgNDI2Ljk0NiA2MDIuMzEzIDQyNi43MzkgNjAzLjMzIDQyNi43MzlDNjA0LjIyNyA0MjYuNzM5IDYwNS4wMTEgNDI2LjkyMyA2MDUuNjgyIDQyNy4yOTNDNjA2LjM1OCA0MjcuNjYyIDYwNi44ODEgNDI4LjIxMyA2MDcuMjUgNDI4Ljk0NkM2MDcuNjI1IDQyOS42NzMgNjA3LjgxMiA0MzAuNTgyIDYwNy44MTIgNDMxLjY3M1Y0NDBINjA1LjI2NFY0MzEuOThDNjA1LjI2NCA0MzEuMDIgNjA1LjAxNyA0MzAuMjc2IDYwNC41MjMgNDI5Ljc0N0M2MDQuMDI4IDQyOS4yMTMgNjAzLjM0MSA0MjguOTQ2IDYwMi40NiA0MjguOTQ2QzYwMS44NTggNDI4Ljk0NiA2MDEuMzE4IDQyOS4wNzQgNjAwLjg0MSA0MjkuMzNDNjAwLjM2OSA0MjkuNTg1IDU5OS45OTcgNDI5Ljk2IDU5OS43MjQgNDMwLjQ1NUM1OTkuNDU3IDQzMC45NDMgNTk5LjMyNCA0MzEuNTM0IDU5OS4zMjQgNDMyLjIyN1pNNjE2Ljg1NSA0NDAuMjY0QzYxNS41NjUgNDQwLjI2NCA2MTQuNDU1IDQzOS45ODkgNjEzLjUyMyA0MzkuNDM4QzYxMi41OTcgNDM4Ljg4MSA2MTEuODgxIDQzOC4wOTkgNjExLjM3NSA0MzcuMDk0QzYxMC44NzUgNDM2LjA4MiA2MTAuNjI1IDQzNC44OTggNjEwLjYyNSA0MzMuNTRDNjEwLjYyNSA0MzIuMTk5IDYxMC44NzUgNDMxLjAxNyA2MTEuMzc1IDQyOS45OTRDNjExLjg4MSA0MjguOTcyIDYxMi41ODUgNDI4LjE3MyA2MTMuNDg5IDQyNy41OTlDNjE0LjM5OCA0MjcuMDI2IDYxNS40NiA0MjYuNzM5IDYxNi42NzYgNDI2LjczOUM2MTcuNDE1IDQyNi43MzkgNjE4LjEzMSA0MjYuODYxIDYxOC44MjQgNDI3LjEwNUM2MTkuNTE3IDQyNy4zNDkgNjIwLjEzOSA0MjcuNzMzIDYyMC42OSA0MjguMjU2QzYyMS4yNDEgNDI4Ljc3OCA2MjEuNjc2IDQyOS40NTcgNjIxLjk5NCA0MzAuMjkzQzYyMi4zMTMgNDMxLjEyMiA2MjIuNDcyIDQzMi4xMzEgNjIyLjQ3MiA0MzMuMzE4VjQzNC4yMjJINjEyLjA2NVY0MzIuMzEySDYxOS45NzRDNjE5Ljk3NCA0MzEuNjQyIDYxOS44MzggNDMxLjA0OCA2MTkuNTY1IDQzMC41MzFDNjE5LjI5MyA0MzAuMDA5IDYxOC45MDkgNDI5LjU5NyA2MTguNDE1IDQyOS4yOTVDNjE3LjkyNiA0MjguOTk0IDYxNy4zNTIgNDI4Ljg0NCA2MTYuNjkzIDQyOC44NDRDNjE1Ljk3NyA0MjguODQ0IDYxNS4zNTIgNDI5LjAyIDYxNC44MTggNDI5LjM3MkM2MTQuMjkgNDI5LjcxOSA2MTMuODgxIDQzMC4xNzMgNjEzLjU5MSA0MzAuNzM2QzYxMy4zMDcgNDMxLjI5MyA2MTMuMTY1IDQzMS44OTggNjEzLjE2NSA0MzIuNTUxVjQzNC4wNDNDNjEzLjE2NSA0MzQuOTE4IDYxMy4zMTggNDM1LjY2MiA2MTMuNjI1IDQzNi4yNzZDNjEzLjkzOCA0MzYuODg5IDYxNC4zNzIgNDM3LjM1OCA2MTQuOTI5IDQzNy42ODJDNjE1LjQ4NiA0MzggNjE2LjEzNiA0MzguMTU5IDYxNi44ODEgNDM4LjE1OUM2MTcuMzY0IDQzOC4xNTkgNjE3LjgwNCA0MzguMDkxIDYxOC4yMDIgNDM3Ljk1NUM2MTguNTk5IDQzNy44MTIgNjE4Ljk0MyA0MzcuNjAyIDYxOS4yMzMgNDM3LjMyNEM2MTkuNTIzIDQzNy4wNDUgNjE5Ljc0NCA0MzYuNzAyIDYxOS44OTggNDM2LjI5M0w2MjIuMzEgNDM2LjcyN0M2MjIuMTE2IDQzNy40MzcgNjIxLjc3IDQzOC4wNiA2MjEuMjcgNDM4LjU5NEM2MjAuNzc2IDQzOS4xMjIgNjIwLjE1MyA0MzkuNTM0IDYxOS40MDMgNDM5LjgzQzYxOC42NTkgNDQwLjExOSA2MTcuODEgNDQwLjI2NCA2MTYuODU1IDQ0MC4yNjRaTTYzMC45NDEgNDQwLjI2NEM2MjkuNjUxIDQ0MC4yNjQgNjI4LjU0IDQzOS45ODkgNjI3LjYwOSA0MzkuNDM4QzYyNi42ODMgNDM4Ljg4MSA2MjUuOTY3IDQzOC4wOTkgNjI1LjQ2MSA0MzcuMDk0QzYyNC45NjEgNDM2LjA4MiA2MjQuNzExIDQzNC44OTggNjI0LjcxMSA0MzMuNTRDNjI0LjcxMSA0MzIuMTk5IDYyNC45NjEgNDMxLjAxNyA2MjUuNDYxIDQyOS45OTRDNjI1Ljk2NyA0MjguOTcyIDYyNi42NzEgNDI4LjE3MyA2MjcuNTc1IDQyNy41OTlDNjI4LjQ4NCA0MjcuMDI2IDYyOS41NDYgNDI2LjczOSA2MzAuNzYyIDQyNi43MzlDNjMxLjUwMSA0MjYuNzM5IDYzMi4yMTcgNDI2Ljg2MSA2MzIuOTEgNDI3LjEwNUM2MzMuNjAzIDQyNy4zNDkgNjM0LjIyNSA0MjcuNzMzIDYzNC43NzYgNDI4LjI1NkM2MzUuMzI3IDQyOC43NzggNjM1Ljc2MiA0MjkuNDU3IDYzNi4wOCA0MzAuMjkzQzYzNi4zOTggNDMxLjEyMiA2MzYuNTU4IDQzMi4xMzEgNjM2LjU1OCA0MzMuMzE4VjQzNC4yMjJINjI2LjE1MVY0MzIuMzEySDYzNC4wNkM2MzQuMDYgNDMxLjY0MiA2MzMuOTI0IDQzMS4wNDggNjMzLjY1MSA0MzAuNTMxQzYzMy4zNzkgNDMwLjAwOSA2MzIuOTk1IDQyOS41OTcgNjMyLjUwMSA0MjkuMjk1QzYzMi4wMTIgNDI4Ljk5NCA2MzEuNDM4IDQyOC44NDQgNjMwLjc3OSA0MjguODQ0QzYzMC4wNjMgNDI4Ljg0NCA2MjkuNDM4IDQyOS4wMiA2MjguOTA0IDQyOS4zNzJDNjI4LjM3NiA0MjkuNzE5IDYyNy45NjcgNDMwLjE3MyA2MjcuNjc3IDQzMC43MzZDNjI3LjM5MyA0MzEuMjkzIDYyNy4yNTEgNDMxLjg5OCA2MjcuMjUxIDQzMi41NTFWNDM0LjA0M0M2MjcuMjUxIDQzNC45MTggNjI3LjQwNCA0MzUuNjYyIDYyNy43MTEgNDM2LjI3NkM2MjguMDIzIDQzNi44ODkgNjI4LjQ1OCA0MzcuMzU4IDYyOS4wMTUgNDM3LjY4MkM2MjkuNTcyIDQzOCA2MzAuMjIyIDQzOC4xNTkgNjMwLjk2NyA0MzguMTU5QzYzMS40NSA0MzguMTU5IDYzMS44OSA0MzguMDkxIDYzMi4yODggNDM3Ljk1NUM2MzIuNjg1IDQzNy44MTIgNjMzLjAyOSA0MzcuNjAyIDYzMy4zMTkgNDM3LjMyNEM2MzMuNjA5IDQzNy4wNDUgNjMzLjgzIDQzNi43MDIgNjMzLjk4NCA0MzYuMjkzTDYzNi4zOTYgNDM2LjcyN0M2MzYuMjAyIDQzNy40MzcgNjM1Ljg1NiA0MzguMDYgNjM1LjM1NiA0MzguNTk0QzYzNC44NjIgNDM5LjEyMiA2MzQuMjM5IDQzOS41MzQgNjMzLjQ4OSA0MzkuODNDNjMyLjc0NSA0NDAuMTE5IDYzMS44OTYgNDQwLjI2NCA2MzAuOTQxIDQ0MC4yNjRaTTY0NS40OTYgNDI2LjkwOVY0MjguOTU1SDYzOC4zNDVWNDI2LjkwOUg2NDUuNDk2Wk02NDAuMjYzIDQyMy43NzNINjQyLjgxMVY0MzYuMTU2QzY0Mi44MTEgNDM2LjY1MSA2NDIuODg1IDQzNy4wMjMgNjQzLjAzMyA0MzcuMjczQzY0My4xOCA0MzcuNTE3IDY0My4zNzEgNDM3LjY4NSA2NDMuNjA0IDQzNy43NzZDNjQzLjg0MiA0MzcuODYxIDY0NC4xMDEgNDM3LjkwMyA2NDQuMzc5IDQzNy45MDNDNjQ0LjU4NCA0MzcuOTAzIDY0NC43NjMgNDM3Ljg4OSA2NDQuOTE2IDQzNy44NjFDNjQ1LjA3IDQzNy44MzIgNjQ1LjE4OSA0MzcuODEgNjQ1LjI3NCA0MzcuNzkzTDY0NS43MzQgNDM5Ljg5OEM2NDUuNTg3IDQzOS45NTUgNjQ1LjM3NiA0NDAuMDExIDY0NS4xMDQgNDQwLjA2OEM2NDQuODMxIDQ0MC4xMzEgNjQ0LjQ5IDQ0MC4xNjUgNjQ0LjA4MSA0NDAuMTdDNjQzLjQxMSA0NDAuMTgyIDY0Mi43ODYgNDQwLjA2MiA2NDIuMjA2IDQzOS44MTJDNjQxLjYyNiA0MzkuNTYyIDY0MS4xNTggNDM5LjE3NiA2NDAuOCA0MzguNjUzQzY0MC40NDIgNDM4LjEzMSA2NDAuMjYzIDQzNy40NzQgNjQwLjI2MyA0MzYuNjg1VjQyMy43NzNaTTY1NC42NjYgNDQwVjQyNi45MDlINjU3LjIxNFY0NDBINjU0LjY2NlpNNjU1Ljk1MyA0MjQuODg5QzY1NS41MSA0MjQuODg5IDY1NS4xMjkgNDI0Ljc0MSA2NTQuODExIDQyNC40NDZDNjU0LjQ5OSA0MjQuMTQ1IDY1NC4zNDIgNDIzLjc4NyA2NTQuMzQyIDQyMy4zNzJDNjU0LjM0MiA0MjIuOTUyIDY1NC40OTkgNDIyLjU5NCA2NTQuODExIDQyMi4yOThDNjU1LjEyOSA0MjEuOTk3IDY1NS41MSA0MjEuODQ3IDY1NS45NTMgNDIxLjg0N0M2NTYuMzk2IDQyMS44NDcgNjU2Ljc3NCA0MjEuOTk3IDY1Ny4wODcgNDIyLjI5OEM2NTcuNDA1IDQyMi41OTQgNjU3LjU2NCA0MjIuOTUyIDY1Ny41NjQgNDIzLjM3MkM2NTcuNTY0IDQyMy43ODcgNjU3LjQwNSA0MjQuMTQ1IDY1Ny4wODcgNDI0LjQ0NkM2NTYuNzc0IDQyNC43NDEgNjU2LjM5NiA0MjQuODg5IDY1NS45NTMgNDI0Ljg4OVpNNjcwLjQ1MiA0MzAuMTA1TDY2OC4xNDMgNDMwLjUxNEM2NjguMDQ2IDQzMC4yMTkgNjY3Ljg5MyA0MjkuOTM3IDY2Ny42ODMgNDI5LjY3QzY2Ny40NzggNDI5LjQwMyA2NjcuMiA0MjkuMTg1IDY2Ni44NDcgNDI5LjAxNEM2NjYuNDk1IDQyOC44NDQgNjY2LjA1NSA0MjguNzU5IDY2NS41MjYgNDI4Ljc1OUM2NjQuODA1IDQyOC43NTkgNjY0LjIwMiA0MjguOTIgNjYzLjcxOSA0MjkuMjQ0QzY2My4yMzcgNDI5LjU2MiA2NjIuOTk1IDQyOS45NzQgNjYyLjk5NSA0MzAuNDhDNjYyLjk5NSA0MzAuOTE4IDY2My4xNTcgNDMxLjI3IDY2My40ODEgNDMxLjUzN0M2NjMuODA1IDQzMS44MDQgNjY0LjMyNyA0MzIuMDIzIDY2NS4wNDkgNDMyLjE5M0w2NjcuMTI5IDQzMi42N0M2NjguMzMzIDQzMi45NDkgNjY5LjIzMSA0MzMuMzc4IDY2OS44MjIgNDMzLjk1N0M2NzAuNDEzIDQzNC41MzcgNjcwLjcwOCA0MzUuMjkgNjcwLjcwOCA0MzYuMjE2QzY3MC43MDggNDM3IDY3MC40ODEgNDM3LjY5OSA2NzAuMDI2IDQzOC4zMTJDNjY5LjU3NyA0MzguOTIgNjY4Ljk1IDQzOS4zOTggNjY4LjE0MyA0MzkuNzQ0QzY2Ny4zNDIgNDQwLjA5MSA2NjYuNDEzIDQ0MC4yNjQgNjY1LjM1NiA0NDAuMjY0QzY2My44OSA0NDAuMjY0IDY2Mi42OTQgNDM5Ljk1MiA2NjEuNzY4IDQzOS4zMjdDNjYwLjg0MiA0MzguNjk2IDY2MC4yNzMgNDM3LjgwMSA2NjAuMDYzIDQzNi42NDJMNjYyLjUyNiA0MzYuMjY3QzY2Mi42OCA0MzYuOTA5IDY2Mi45OTUgNDM3LjM5NSA2NjMuNDcyIDQzNy43MjRDNjYzLjk1IDQzOC4wNDggNjY0LjU3MiA0MzguMjEgNjY1LjMzOSA0MzguMjFDNjY2LjE3NCA0MzguMjEgNjY2Ljg0MiA0MzguMDM3IDY2Ny4zNDIgNDM3LjY5QzY2Ny44NDIgNDM3LjMzOCA2NjguMDkyIDQzNi45MDkgNjY4LjA5MiA0MzYuNDAzQzY2OC4wOTIgNDM1Ljk5NCA2NjcuOTM4IDQzNS42NTEgNjY3LjYzMSA0MzUuMzcyQzY2Ny4zMyA0MzUuMDk0IDY2Ni44NjcgNDM0Ljg4NCA2NjYuMjQyIDQzNC43NDFMNjY0LjAyNiA0MzQuMjU2QzY2Mi44MDUgNDMzLjk3NyA2NjEuOTAxIDQzMy41MzQgNjYxLjMxNiA0MzIuOTI2QzY2MC43MzcgNDMyLjMxOCA2NjAuNDQ3IDQzMS41NDggNjYwLjQ0NyA0MzAuNjE2QzY2MC40NDcgNDI5Ljg0NCA2NjAuNjYzIDQyOS4xNjggNjYxLjA5NCA0MjguNTg4QzY2MS41MjYgNDI4LjAwOSA2NjIuMTIzIDQyNy41NTcgNjYyLjg4NCA0MjcuMjMzQzY2My42NDYgNDI2LjkwMyA2NjQuNTE4IDQyNi43MzkgNjY1LjUwMSA0MjYuNzM5QzY2Ni45MTUgNDI2LjczOSA2NjguMDI5IDQyNy4wNDUgNjY4Ljg0MiA0MjcuNjU5QzY2OS42NTQgNDI4LjI2NyA2NzAuMTkxIDQyOS4wODIgNjcwLjQ1MiA0MzAuMTA1Wk02ODkuMjExIDQ0MFY0NDIuMTY1SDY3OC4xMjNWNDQwSDY4OS4yMTFaTTcwMC4yNSA0NDBWNDQyLjE2NUg2ODkuMTYyVjQ0MEg3MDAuMjVaTTcxMS4yODkgNDQwVjQ0Mi4xNjVINzAwLjIwMVY0NDBINzExLjI4OVpNNzIyLjMyOCA0NDBWNDQyLjE2NUg3MTEuMjRWNDQwSDcyMi4zMjhaTTczMy4zNjcgNDQwVjQ0Mi4xNjVINzIyLjI3OVY0NDBINzMzLjM2N1pNNzQ0LjQwNiA0NDBWNDQyLjE2NUg3MzMuMzE4VjQ0MEg3NDQuNDA2Wk03NTUuNDQ1IDQ0MFY0NDIuMTY1SDc0NC4zNTdWNDQwSDc1NS40NDVaTTc2Ni40ODQgNDQwVjQ0Mi4xNjVINzU1LjM5NlY0NDBINzY2LjQ4NFpNNzc3LjUyMyA0NDBWNDQyLjE2NUg3NjYuNDM1VjQ0MEg3NzcuNTIzWk03ODguNTYyIDQ0MFY0NDIuMTY1SDc3Ny40NzRWNDQwSDc4OC41NjJaTTc5OS42MDIgNDQwVjQ0Mi4xNjVINzg4LjUxM1Y0NDBINzk5LjYwMlpNODEwLjY0MSA0NDBWNDQyLjE2NUg3OTkuNTUzVjQ0MEg4MTAuNjQxWk04MjEuNjggNDQwVjQ0Mi4xNjVIODEwLjU5MlY0NDBIODIxLjY4Wk04MzIuNzE5IDQ0MFY0NDIuMTY1SDgyMS42MzFWNDQwSDgzMi43MTlaTTg0My43NTggNDQwVjQ0Mi4xNjVIODMyLjY3VjQ0MEg4NDMuNzU4Wk04NTQuNzk3IDQ0MFY0NDIuMTY1SDg0My43MDlWNDQwSDg1NC43OTdaTTg2NS44MzYgNDQwVjQ0Mi4xNjVIODU0Ljc0OFY0NDBIODY1LjgzNloiIGZpbGw9ImJsYWNrIi8+CjwvZz4KPGRlZnM+CjxsaW5lYXJHcmFkaWVudCBpZD0icGFpbnQwX2xpbmVhcl8zXzMiIHgxPSIxNDAwIiB5MT0iNS44NDEyNWUtMDUiIHgyPSI1LjUwODM4ZS0wNSIgeTI9Ijk5MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiPgo8c3RvcCBzdG9wLWNvbG9yPSIjMTA5NjM1Ii8+CjxzdG9wIG9mZnNldD0iMC41NDA2NjEiIHN0b3AtY29sb3I9IiMxMDk2MzUiIHN0b3Atb3BhY2l0eT0iMC42MTk3OTIiLz4KPHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjMTI5QTM4IiBzdG9wLW9wYWNpdHk9IjAiLz4KPC9saW5lYXJHcmFkaWVudD4KPC9kZWZzPgo8L3N2Zz4K

Step #6 - Put it where you need it!

Paste this long string on your Launch image field under UX -> Brand

You have to select "Custom" first to make that field appear. So it should look like this:

Step #7 - Done! And keep playing with it

I hope this gives some help to some of you.

This was really basic, we didn't added logos or something, but I hope this gives a base to anyone that's new to any of this concepts.

Also, in case you are interested

How it looks on my side:

The actual svg code inside the .svg file:

<svg xmlns="http://www.w3.org/2000/svg" width="1400" height="1000" viewBox="0 0 1400 1000" fill="none">
<g id="appsheet-launch-image">
<rect id="background" width="1400" height="1000" fill="url(#paint0_linear_3_3)"/>
<path id="text-1" d="M536.58 440H533.784L540.065 422.545H543.108L549.389 440H546.594L541.659 425.716H541.523L536.58 440ZM537.048 433.165H546.116V435.381H537.048V433.165ZM551.705 444.909V426.909H554.194V429.031H554.407C554.555 428.759 554.768 428.443 555.046 428.085C555.325 427.727 555.711 427.415 556.205 427.148C556.7 426.875 557.353 426.739 558.165 426.739C559.222 426.739 560.165 427.006 560.995 427.54C561.825 428.074 562.475 428.844 562.947 429.849C563.424 430.855 563.663 432.065 563.663 433.48C563.663 434.895 563.427 436.108 562.955 437.119C562.484 438.125 561.836 438.901 561.012 439.446C560.188 439.986 559.248 440.256 558.191 440.256C557.396 440.256 556.745 440.122 556.239 439.855C555.739 439.588 555.347 439.276 555.063 438.918C554.779 438.56 554.56 438.241 554.407 437.963H554.254V444.909H551.705ZM554.202 433.455C554.202 434.375 554.336 435.182 554.603 435.875C554.87 436.568 555.256 437.111 555.762 437.503C556.268 437.889 556.887 438.082 557.62 438.082C558.381 438.082 559.018 437.881 559.529 437.477C560.04 437.068 560.427 436.514 560.688 435.815C560.955 435.116 561.089 434.33 561.089 433.455C561.089 432.591 560.958 431.815 560.697 431.128C560.441 430.44 560.055 429.898 559.538 429.5C559.026 429.102 558.387 428.903 557.62 428.903C556.881 428.903 556.256 429.094 555.745 429.474C555.239 429.855 554.856 430.386 554.594 431.068C554.333 431.75 554.202 432.545 554.202 433.455ZM566.518 444.909V426.909H569.006V429.031H569.219C569.367 428.759 569.58 428.443 569.859 428.085C570.137 427.727 570.523 427.415 571.018 427.148C571.512 426.875 572.165 426.739 572.978 426.739C574.035 426.739 574.978 427.006 575.808 427.54C576.637 428.074 577.288 428.844 577.759 429.849C578.237 430.855 578.475 432.065 578.475 433.48C578.475 434.895 578.239 436.108 577.768 437.119C577.296 438.125 576.648 438.901 575.825 439.446C575.001 439.986 574.06 440.256 573.004 440.256C572.208 440.256 571.558 440.122 571.052 439.855C570.552 439.588 570.16 439.276 569.876 438.918C569.592 438.56 569.373 438.241 569.219 437.963H569.066V444.909H566.518ZM569.015 433.455C569.015 434.375 569.148 435.182 569.415 435.875C569.683 436.568 570.069 437.111 570.575 437.503C571.08 437.889 571.7 438.082 572.433 438.082C573.194 438.082 573.83 437.881 574.342 437.477C574.853 437.068 575.239 436.514 575.501 435.815C575.768 435.116 575.901 434.33 575.901 433.455C575.901 432.591 575.771 431.815 575.509 431.128C575.254 430.44 574.867 429.898 574.35 429.5C573.839 429.102 573.2 428.903 572.433 428.903C571.694 428.903 571.069 429.094 570.558 429.474C570.052 429.855 569.668 430.386 569.407 431.068C569.146 431.75 569.015 432.545 569.015 433.455ZM591.055 427.131C590.964 426.324 590.589 425.699 589.93 425.256C589.271 424.807 588.441 424.582 587.441 424.582C586.725 424.582 586.106 424.696 585.583 424.923C585.06 425.145 584.654 425.452 584.364 425.844C584.08 426.23 583.938 426.67 583.938 427.165C583.938 427.58 584.035 427.937 584.228 428.239C584.427 428.54 584.685 428.793 585.004 428.997C585.327 429.196 585.674 429.364 586.043 429.5C586.413 429.631 586.768 429.739 587.109 429.824L588.813 430.267C589.37 430.403 589.941 430.588 590.526 430.821C591.112 431.054 591.654 431.361 592.154 431.741C592.654 432.122 593.058 432.594 593.364 433.156C593.677 433.719 593.833 434.392 593.833 435.176C593.833 436.165 593.577 437.043 593.066 437.81C592.56 438.577 591.825 439.182 590.859 439.625C589.898 440.068 588.737 440.29 587.373 440.29C586.066 440.29 584.935 440.082 583.981 439.668C583.026 439.253 582.279 438.665 581.739 437.903C581.2 437.136 580.901 436.227 580.844 435.176H583.487C583.538 435.807 583.742 436.332 584.1 436.753C584.464 437.168 584.927 437.477 585.489 437.682C586.058 437.881 586.68 437.98 587.356 437.98C588.1 437.98 588.762 437.864 589.342 437.631C589.927 437.392 590.387 437.062 590.722 436.642C591.058 436.216 591.225 435.719 591.225 435.151C591.225 434.634 591.077 434.21 590.782 433.881C590.492 433.551 590.097 433.278 589.597 433.062C589.103 432.847 588.543 432.656 587.918 432.491L585.856 431.929C584.458 431.548 583.35 430.989 582.532 430.25C581.719 429.511 581.313 428.534 581.313 427.318C581.313 426.312 581.586 425.435 582.131 424.685C582.677 423.935 583.415 423.352 584.347 422.938C585.279 422.517 586.33 422.307 587.501 422.307C588.683 422.307 589.725 422.514 590.629 422.929C591.538 423.344 592.254 423.915 592.776 424.642C593.299 425.364 593.572 426.193 593.594 427.131H591.055ZM599.324 432.227V440H596.776V422.545H599.29V429.04H599.452C599.759 428.335 600.227 427.776 600.858 427.361C601.489 426.946 602.313 426.739 603.33 426.739C604.227 426.739 605.011 426.923 605.682 427.293C606.358 427.662 606.881 428.213 607.25 428.946C607.625 429.673 607.812 430.582 607.812 431.673V440H605.264V431.98C605.264 431.02 605.017 430.276 604.523 429.747C604.028 429.213 603.341 428.946 602.46 428.946C601.858 428.946 601.318 429.074 600.841 429.33C600.369 429.585 599.997 429.96 599.724 430.455C599.457 430.943 599.324 431.534 599.324 432.227ZM616.855 440.264C615.565 440.264 614.455 439.989 613.523 439.438C612.597 438.881 611.881 438.099 611.375 437.094C610.875 436.082 610.625 434.898 610.625 433.54C610.625 432.199 610.875 431.017 611.375 429.994C611.881 428.972 612.585 428.173 613.489 427.599C614.398 427.026 615.46 426.739 616.676 426.739C617.415 426.739 618.131 426.861 618.824 427.105C619.517 427.349 620.139 427.733 620.69 428.256C621.241 428.778 621.676 429.457 621.994 430.293C622.313 431.122 622.472 432.131 622.472 433.318V434.222H612.065V432.312H619.974C619.974 431.642 619.838 431.048 619.565 430.531C619.293 430.009 618.909 429.597 618.415 429.295C617.926 428.994 617.352 428.844 616.693 428.844C615.977 428.844 615.352 429.02 614.818 429.372C614.29 429.719 613.881 430.173 613.591 430.736C613.307 431.293 613.165 431.898 613.165 432.551V434.043C613.165 434.918 613.318 435.662 613.625 436.276C613.938 436.889 614.372 437.358 614.929 437.682C615.486 438 616.136 438.159 616.881 438.159C617.364 438.159 617.804 438.091 618.202 437.955C618.599 437.812 618.943 437.602 619.233 437.324C619.523 437.045 619.744 436.702 619.898 436.293L622.31 436.727C622.116 437.437 621.77 438.06 621.27 438.594C620.776 439.122 620.153 439.534 619.403 439.83C618.659 440.119 617.81 440.264 616.855 440.264ZM630.941 440.264C629.651 440.264 628.54 439.989 627.609 439.438C626.683 438.881 625.967 438.099 625.461 437.094C624.961 436.082 624.711 434.898 624.711 433.54C624.711 432.199 624.961 431.017 625.461 429.994C625.967 428.972 626.671 428.173 627.575 427.599C628.484 427.026 629.546 426.739 630.762 426.739C631.501 426.739 632.217 426.861 632.91 427.105C633.603 427.349 634.225 427.733 634.776 428.256C635.327 428.778 635.762 429.457 636.08 430.293C636.398 431.122 636.558 432.131 636.558 433.318V434.222H626.151V432.312H634.06C634.06 431.642 633.924 431.048 633.651 430.531C633.379 430.009 632.995 429.597 632.501 429.295C632.012 428.994 631.438 428.844 630.779 428.844C630.063 428.844 629.438 429.02 628.904 429.372C628.376 429.719 627.967 430.173 627.677 430.736C627.393 431.293 627.251 431.898 627.251 432.551V434.043C627.251 434.918 627.404 435.662 627.711 436.276C628.023 436.889 628.458 437.358 629.015 437.682C629.572 438 630.222 438.159 630.967 438.159C631.45 438.159 631.89 438.091 632.288 437.955C632.685 437.812 633.029 437.602 633.319 437.324C633.609 437.045 633.83 436.702 633.984 436.293L636.396 436.727C636.202 437.437 635.856 438.06 635.356 438.594C634.862 439.122 634.239 439.534 633.489 439.83C632.745 440.119 631.896 440.264 630.941 440.264ZM645.496 426.909V428.955H638.345V426.909H645.496ZM640.263 423.773H642.811V436.156C642.811 436.651 642.885 437.023 643.033 437.273C643.18 437.517 643.371 437.685 643.604 437.776C643.842 437.861 644.101 437.903 644.379 437.903C644.584 437.903 644.763 437.889 644.916 437.861C645.07 437.832 645.189 437.81 645.274 437.793L645.734 439.898C645.587 439.955 645.376 440.011 645.104 440.068C644.831 440.131 644.49 440.165 644.081 440.17C643.411 440.182 642.786 440.062 642.206 439.812C641.626 439.562 641.158 439.176 640.8 438.653C640.442 438.131 640.263 437.474 640.263 436.685V423.773ZM654.666 440V426.909H657.214V440H654.666ZM655.953 424.889C655.51 424.889 655.129 424.741 654.811 424.446C654.499 424.145 654.342 423.787 654.342 423.372C654.342 422.952 654.499 422.594 654.811 422.298C655.129 421.997 655.51 421.847 655.953 421.847C656.396 421.847 656.774 421.997 657.087 422.298C657.405 422.594 657.564 422.952 657.564 423.372C657.564 423.787 657.405 424.145 657.087 424.446C656.774 424.741 656.396 424.889 655.953 424.889ZM670.452 430.105L668.143 430.514C668.046 430.219 667.893 429.937 667.683 429.67C667.478 429.403 667.2 429.185 666.847 429.014C666.495 428.844 666.055 428.759 665.526 428.759C664.805 428.759 664.202 428.92 663.719 429.244C663.237 429.562 662.995 429.974 662.995 430.48C662.995 430.918 663.157 431.27 663.481 431.537C663.805 431.804 664.327 432.023 665.049 432.193L667.129 432.67C668.333 432.949 669.231 433.378 669.822 433.957C670.413 434.537 670.708 435.29 670.708 436.216C670.708 437 670.481 437.699 670.026 438.312C669.577 438.92 668.95 439.398 668.143 439.744C667.342 440.091 666.413 440.264 665.356 440.264C663.89 440.264 662.694 439.952 661.768 439.327C660.842 438.696 660.273 437.801 660.063 436.642L662.526 436.267C662.68 436.909 662.995 437.395 663.472 437.724C663.95 438.048 664.572 438.21 665.339 438.21C666.174 438.21 666.842 438.037 667.342 437.69C667.842 437.338 668.092 436.909 668.092 436.403C668.092 435.994 667.938 435.651 667.631 435.372C667.33 435.094 666.867 434.884 666.242 434.741L664.026 434.256C662.805 433.977 661.901 433.534 661.316 432.926C660.737 432.318 660.447 431.548 660.447 430.616C660.447 429.844 660.663 429.168 661.094 428.588C661.526 428.009 662.123 427.557 662.884 427.233C663.646 426.903 664.518 426.739 665.501 426.739C666.915 426.739 668.029 427.045 668.842 427.659C669.654 428.267 670.191 429.082 670.452 430.105ZM689.211 440V442.165H678.123V440H689.211ZM700.25 440V442.165H689.162V440H700.25ZM711.289 440V442.165H700.201V440H711.289ZM722.328 440V442.165H711.24V440H722.328ZM733.367 440V442.165H722.279V440H733.367ZM744.406 440V442.165H733.318V440H744.406ZM755.445 440V442.165H744.357V440H755.445ZM766.484 440V442.165H755.396V440H766.484ZM777.523 440V442.165H766.435V440H777.523ZM788.562 440V442.165H777.474V440H788.562ZM799.602 440V442.165H788.513V440H799.602ZM810.641 440V442.165H799.553V440H810.641ZM821.68 440V442.165H810.592V440H821.68ZM832.719 440V442.165H821.631V440H832.719ZM843.758 440V442.165H832.67V440H843.758ZM854.797 440V442.165H843.709V440H854.797ZM865.836 440V442.165H854.748V440H865.836Z" fill="black"/>
</g>
<defs>
<linearGradient id="paint0_linear_3_3" x1="1400" y1="5.84125e-05" x2="5.50838e-05" y2="993" gradientUnits="userSpaceOnUse">
<stop stop-color="#109635"/>
<stop offset="0.540661" stop-color="#109635" stop-opacity="0.619792"/>
<stop offset="1" stop-color="#129A38" stop-opacity="0"/>
</linearGradient>
</defs>
</svg>

If you are interested, you can use SVG inside your app to make custom menus or something, anywhere an image can go.

Take a look at this awesome post and sample app for that.

You could use the code made from Figma, but use simple icons since the data can be quite large and the workbook has limits for how many characters can be inside a cell.

Joseph_Seddik

👏👏👏👏👏👏👏 Thank you!

Ratatosk

@SkrOYC Great summary!

Also a good practice is to minify all UI image files for faster loading.

For SVGs I usually use https://jakearchibald.github.io/svgomg/

Kirk_Masden

This tip has been very useful to me because it taught me how to put SVG images (just to code, of course, which is enough) directly in virtual and/or real image columns. I have found that it works well. However, in regard to "App logo" and "Launch image" I haven't been able to get it to work. I always get this:

Has something changed? Is the tip still valid? I wonder what my problem is. As I say, it works for me in image columns but not with the logo or launch image.

SkrOYC

@Kirk_Masden wrote:

However, in regard to "App logo" and "Launch image" I haven't been able to get it to work

I use this on Launch Image with no problems, make sure to add the "data&colon;image/...." at the beginning and always use base64 encoding.

About App Logo, it looks great inside the app but it doesn't show up on shortcuts, so I'm avoiding that.

If you want to use the images inside the app, like in an image column, you must use the actual SVG code, like in @GreenFlux's tip here

You may be using the SVG Code instead of the base64 encoded code, take a look just in case 😉

Kirk_Masden

Thanks! None of the problems you mentioned seem to apply to my case. I'm puzzled. I copied your code for your launch image and put it in my app. This time it didn't break my app but I couldn't see the launch image when I synced. 😞

SkrOYC

Check the so called "colon" that this community changes from the two dots ":"

Kirk_Masden

Thanks! Sorry to be so stupid. That allowed me to use your image. Your image is long but still not as long as mine. Yours is 14794 characters but mine has been much bigger. That may be part of the problem I've had with my own images. I'll try to look into it.
P.S. My images were over the 50,000 character limit per cell that Google sheets imposes. That specific limitation may not be relevant here but that gives you a sense of the size of the image. Perhaps I can get it to work if I can make it smaller.

Kirk_Masden

Got it to work. The problem doesn't seem to have been the number of characters. I think the way in which a png file was embedded was the problem. When I converted the png to a bitmap image inside my Inkscape program, it worked. Thanks for your patience!

Kirk_Masden

Sorry to keep replying to the same thread but I had a problem with the logo. It worked inside the app:

However, the thumbnail in "My apps" broke.

So, I don't think I'll use this for my logo.

SkrOYC

@SkrOYC wrote:

About App Logo, it looks great inside the app but it doesn't show up on shortcuts, so I'm avoiding that.

Kirk_Masden

Oops! I guess I missed this. Thanks for the clarification!

Telecom

Excelente recomendación, te lo agradezco 😎

SkrOYC

Luce genial!

ThisIsIdrees

Thanks man. well done.