# Beautiful Design App

**URL:** https://community.glideapps.com/t/beautiful-design-app/16191
**Category:** Project Showcase
**Created:** [September 22, 2020, 12:23pm UTC](https://community.glideapps.com/t/beautiful-design-app/16191 "2020-09-22T12:23:59Z")
**Posts on this page:** 1
**Showing post:** 44

<div class="post-metadata">

### Author: ![Robert\_Petitto](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/robert_petitto/32/25193_2.png) [@Robert\_Petitto](https://community.glideapps.com/u/Robert_Petitto)
#### Post date: [September 25, 2020, 3:09am UTC](https://community.glideapps.com/t/beautiful-design-app/16191/44 "2020-09-25T03:09:21Z")

</div>

Several ways. Depends what else is on the screen. You can use an image component and then style it. I’m using a round tile component, setting it to 2 tiles per row and then creating a Rich text box with this CSS:

```auto
.fdeRBK {
    grid-template-columns: repeat(1, 1fr);
    width: 200px;
    margin: auto;
}

```

If you want the colored background, I placed the rich text box with the CSS at the very top and included this CSS:

```auto
<pre>
<span><style>
[data-test=app-markdown-view] {
background-image: url("https://www.colorbook.io/imagecreator.php?hex=ff5723&width=1054&height=548");
position: absolute;
height:100px;
width: 100%;
}

```

So the entire code in the Rich text box is

```auto
<pre>
<span><style>
.fdeRBK {
    grid-template-columns: repeat(1, 1fr);
    width: 200px;
    margin: auto;
}
[data-test=app-markdown-view] {
background-image: url("https://www.colorbook.io/imagecreator.php?hex=ff5723&width=1054&height=548");
position: absolute;
height:100px;
width: 100%;
}

```

Note, you can change the background image to whatever you want. The one I included, you can change the hexcode to match your theme!

Variations:

 ![Screen Shot 2020-09-24 at 10.49.44 PM](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/2X/3/3022d95615ecd870a266cf6bc16912fe9ff94e1d.png)

 ![2020-09-24 23.08.37](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/2X/7/75e77f03ae9dfa94382157c549e302b834fe6698.gif)

---

_[View the full topic](https://community.glideapps.com/t/beautiful-design-app/16191)._