# Overlay text without Gradient

**URL:** https://community.glideapps.com/t/overlay-text-without-gradient/2638
**Category:** Feature Requests
**Created:** [December 5, 2019, 6:21am UTC](https://community.glideapps.com/t/overlay-text-without-gradient/2638 "2019-12-05T06:21:46Z")
**Posts on this page:** 10
**Page:** 1

<div class="post-metadata">

### Author: ![ionamol](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/ionamol/32/1951_2.png) [@ionamol](https://community.glideapps.com/u/ionamol)
#### Post date: [December 5, 2019, 6:21am UTC](https://community.glideapps.com/t/overlay-text-without-gradient/2638/1 "2019-12-05T06:21:47Z")

</div>

Would be great to be able to choose if I want the dark gradient behind the overlay text in Title and Tiles, sometimes the contrast is already great, especially if we are using a gradient or color fill.

Thanks!

---

<div class="post-metadata">

### Author: ![JackVaughan](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jackvaughan/32/49023_2.png) [@JackVaughan](https://community.glideapps.com/u/JackVaughan)
#### Post date: [December 5, 2019, 9:22am UTC](https://community.glideapps.com/t/overlay-text-without-gradient/2638/2 "2019-12-05T09:22:36Z")

</div>

Good point.

---

<div class="post-metadata">

### Author: ![nathanaelb](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/nathanaelb/32/43079_2.png) [@nathanaelb](https://community.glideapps.com/u/nathanaelb)
#### Post date: [May 20, 2020, 5:59pm UTC](https://community.glideapps.com/t/overlay-text-without-gradient/2638/3 "2020-05-20T17:59:13Z")

</div>

Hello Gliders and @ionamol,

I hope I am not going to make too much a fool out of myself.

I would like to create the following image (created on [Canva](https://www.canva.com/)) as the home of one of the tabs (the starting screen of the app for instance):

 ![glideapp-screenshot-items-centered-transparent-or-colored-background](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/2X/b/b47adf569397c75da8b76742658ed568c288f441.png)

Requirements / wishes:

1. These items are to be clickable: by tapping on them, the user is led to the item’s screen (i.e. these are not headlines)
2. **Edit** The item names (“Item name 1”, “Item name 2”, etc.) will change based on user input. This list is a list of items.
3. Ideally, I could change the background behind the item name: image, color.

My thoughts:

- The list and compact layouts do not work: they do not offer that kind of styling options (bigger text, centered)
- Calendar, map and checklist layouts seem far-fetched.
- Display layout: the action text component does not offer the desired styling options.
- Cards layout: I cannot get it to work.
- Tile layout: I thought this would be the most promising as this layout is the most versatile. However when I set the text to sit on top of the picture (which might be a 1x1 color pixel to get a colored background), a grey overlay automatically appears between the image and the text. This overlay distorts any color that maybe be in the image, colored pixel or why not transparent pixel.

I am therefore wondering if I can achieve the image above. If you have any simple ideas, please do not hesitate to share and I will try to implement them.

---

<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: [May 20, 2020, 9:54pm UTC](https://community.glideapps.com/t/overlay-text-without-gradient/2638/4 "2020-05-20T21:54:45Z")

</div>

Could you just create each of those item-headers as images and do “link to screen“?

---

<div class="post-metadata">

### Author: ![nathanaelb](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/nathanaelb/32/43079_2.png) [@nathanaelb](https://community.glideapps.com/u/nathanaelb)
#### Post date: [May 20, 2020, 10:20pm UTC](https://community.glideapps.com/t/overlay-text-without-gradient/2638/5 "2020-05-20T22:20:35Z")

</div>

@Robert_Petitto I don’t understand the grammar of your sentence and don’t know Glide well enough to make out what you meant.

The item names (“Item name 1”, “Item name 2”, etc.) will change based on user input. In fact, I probably wasn’t clear enough, but this list is a list of items.

---

<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: [May 20, 2020, 10:52pm UTC](https://community.glideapps.com/t/overlay-text-without-gradient/2638/6 "2020-05-20T22:52:01Z")

</div>

Didn’t realize this list was dynamic based on user input. No great way to do that then. Tiles is your best bet, maybe use Cloudinary to create the images for the tile (user input of text = parameter over background image of your choosing)?

---

<div class="post-metadata">

### Author: ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)
#### Post date: [May 20, 2020, 11:46pm UTC](https://community.glideapps.com/t/overlay-text-without-gradient/2638/7 "2020-05-20T23:46:17Z")

</div>

+1 for cloudinary, that’s the best bet to create a dynamic image. @nathanaelb and anyone who’s interested can read (and watch!) about it here.

> [@Cloudinary: Image Filters and Overlays in Glide!](https://community.glideapps.com/t/cloudinary-image-filters-and-overlays-in-glide/4917):
>
> Thanks to @ionamol for keying me into Cloudinary for on the fly, URL based image editing! This awesome resource allowed me to gray out badges that haven’t yet been earned by the user— Started by uploading the image into Cloudinary and then using the built in tools to generate the new URL. Used this URL schema to create this formula: Then, simply created an if/then in Glide. If the badge was owned by the user, then use the colored URL, i…

---

<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: [May 20, 2020, 11:47pm UTC](https://community.glideapps.com/t/overlay-text-without-gradient/2638/8 "2020-05-20T23:47:40Z")

</div>

The one where I talk about text overlays is here:

> [@Cloudinary Strikes again: Text over Images!](https://community.glideapps.com/t/cloudinary-strikes-again-text-over-images/5269):
>
> Use inputted text, a bit of concatenation and Cloudinary to present values over colored images displayed nicely in a markdown table: See my other post on Cloudinary for more info: [https://community.glideapps.com/t/cloudinary-image-filters-and-overlays-in-glide](https://community.glideapps.com/t/cloudinary-image-filters-and-overlays-in-glide)

---

<div class="post-metadata">

### Author: ![nathanaelb](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/nathanaelb/32/43079_2.png) [@nathanaelb](https://community.glideapps.com/u/nathanaelb)
#### Post date: [May 21, 2020, 7:49am UTC](https://community.glideapps.com/t/overlay-text-without-gradient/2638/9 "2020-05-21T07:49:03Z")

</div>

No problem, I wasn’t clear. I don’t think it matters who inputs the data, but I do think it matters that the items are part of a dynamic list 🙂

I was afraid someone would mention Cloudinary.

---

<div class="post-metadata">

### Author: ![nathanaelb](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/nathanaelb/32/43079_2.png) [@nathanaelb](https://community.glideapps.com/u/nathanaelb)
#### Post date: [May 21, 2020, 7:49am UTC](https://community.glideapps.com/t/overlay-text-without-gradient/2638/10 "2020-05-21T07:49:15Z")

</div>

+1 to the feature request “Overlay text without gradient” 🙏🏻
