# Cards with rich text **URL:** \ **Category:** Ask for Help\ **Created:** [December 23, 2021, 7:53am UTC](https://community.glideapps.com/t/cards-with-rich-text/36273 "2021-12-23T07:53:32Z")\ **Posts on this page:** 14\ **Page:** 1
**Author:** ![Martina\_G](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/martina_g/32/22597_2.png) [@Martina\_G](https://community.glideapps.com/u/Martina_G)\ **Post date:** [December 23, 2021, 7:53am UTC](https://community.glideapps.com/t/cards-with-rich-text/36273/1 "2021-12-23T07:53:32Z")
Hey guys, is there any possibility to create cards with rich text? (see screenshot) - user specific data on the card - hover/tab area on card - show new screen ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/f/4/f4eab1d094d228f699a70adfc77f90698f927b34.png) ---
**Author:** ![Pratik\_Shah](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/pratik_shah/32/12416_2.png) [@Pratik\_Shah](https://community.glideapps.com/u/Pratik_Shah)\ **Post date:** [December 23, 2021, 9:01am UTC](https://community.glideapps.com/t/cards-with-rich-text/36273/2 "2021-12-23T09:01:18Z")
You can do this using css. ---
**Author:** ![Martina\_G](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/martina_g/32/22597_2.png) [@Martina\_G](https://community.glideapps.com/u/Martina_G)\ **Post date:** [December 23, 2021, 10:02am UTC](https://community.glideapps.com/t/cards-with-rich-text/36273/3 "2021-12-23T10:02:10Z")
@Pratik_Shah đź‘Ť. Sounds good. Where can I add the CSS - in the rich text component? ---
**Author:** ![Pratik\_Shah](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/pratik_shah/32/12416_2.png) [@Pratik\_Shah](https://community.glideapps.com/u/Pratik_Shah)\ **Post date:** [December 23, 2021, 10:18am UTC](https://community.glideapps.com/t/cards-with-rich-text/36273/4 "2021-12-23T10:18:14Z")
Yes, you have to create template column with user specific data and show this column in rich text component. ---
**Author:** ![Martina\_G](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/martina_g/32/22597_2.png) [@Martina\_G](https://community.glideapps.com/u/Martina_G)\ **Post date:** [December 23, 2021, 8:04pm UTC](https://community.glideapps.com/t/cards-with-rich-text/36273/5 "2021-12-23T20:04:49Z")
how do I create the reference from the rich text comp to the user data? ---
**Author:** ![Uzo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/uzo/32/22639_2.png) [@Uzo](https://community.glideapps.com/u/Uzo)\ **Post date:** [December 23, 2021, 8:10pm UTC](https://community.glideapps.com/t/cards-with-rich-text/36273/6 "2021-12-23T20:10:24Z")
Use template column to write the code, and use that template in rich text ---
**Author:** ![Martina\_G](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/martina_g/32/22597_2.png) [@Martina\_G](https://community.glideapps.com/u/Martina_G)\ **Post date:** [December 29, 2021, 2:24pm UTC](https://community.glideapps.com/t/cards-with-rich-text/36273/7 "2021-12-29T14:24:32Z")
Hey guys, I am trying to add now CSS to the rich text field, but I cannot figure out exactly how to modify the CSS so that the field actually displays what I want it to (see my screenshot above). I know I have to use both CSS and HTML. I think I must just be missing some small but important keystrokes in how to denote CSS vs. HTML in the field. Can you help me? ---
**Author:** ![Uzo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/uzo/32/22639_2.png) [@Uzo](https://community.glideapps.com/u/Uzo)\ **Post date:** [December 29, 2021, 2:34pm UTC](https://community.glideapps.com/t/cards-with-rich-text/36273/8 "2021-12-29T14:34:11Z")
you forgot to add screenshot and code… you can find some samples here: > **[Code BOOK](https://code-book.glideapp.io/)** > > share cool codes, scripts and links ---
**Author:** ![Martina\_G](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/martina_g/32/22597_2.png) [@Martina\_G](https://community.glideapps.com/u/Martina_G)\ **Post date:** [December 29, 2021, 3:55pm UTC](https://community.glideapps.com/t/cards-with-rich-text/36273/9 "2021-12-29T15:55:15Z")
Hey @Uzo, thanks for your help. I found this example created by you: [Code BOOK - Desktop](https://code-book-desktop.glideapp.io/dl/ewAiAHQAIgA6ADIALAAiAHMAIgA6ACIAYwBsAGEAcwBzAC0AYwBvAGQAZQBzACIALAAiAHIAIgA6ACIAVQBBAHkAegBsAEwANABtAFQAeQBTAEgAOQBlAHgARQBvAEMAVQBIAEkAZwAiACwAIgBuACIAOgAiAEMAUwBTACAAYwBvAGQAZQAiAH0A/full) From my understanding, this a style that is add to the list component, right? So not applicable to my needs. I want to create a card with a background image. Title centered above image. ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/c/6/c6e3d7b2028a287b8b013c8aca67ad5ce4e8a29f.png) Code in the rich text component: (Picture is just placeholder) How can I add the css styles? ![](upload://3hD26mx8582w8lloz5V1S5IjMXJ.jpeg) Spendings ---
**Author:** ![Uzo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/uzo/32/22639_2.png) [@Uzo](https://community.glideapps.com/u/Uzo)\ **Post date:** [December 29, 2021, 4:05pm UTC](https://community.glideapps.com/t/cards-with-rich-text/36273/10 "2021-12-29T16:05:41Z")
you need to add a rich text component and paste the code there ![Screen Shot 2021-12-29 at 11.05.15 AM](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/a/5/a5111f0fcd6c3df6ccce573486a96b16c872d89f.png) ---
**Author:** ![Martina\_G](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/martina_g/32/22597_2.png) [@Martina\_G](https://community.glideapps.com/u/Martina_G)\ **Post date:** [December 29, 2021, 5:11pm UTC](https://community.glideapps.com/t/cards-with-rich-text/36273/11 "2021-12-29T17:11:11Z")
I added the code in the rich text comp. The result is a background image on the top of the view. ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/5/7/57731a959261e47f191121843cd98f5566dd118a.jpeg) Below is the rich text comp with HTML for the card, but no CSS. ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/7/d/7d7be0c9c9ddb9dea17a1aeb2c25f4a1438d78c9.png) Both don´t show the expected result. What is wrong? ---
**Author:** ![Uzo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/uzo/32/22639_2.png) [@Uzo](https://community.glideapps.com/u/Uzo)\ **Post date:** [December 29, 2021, 5:15pm UTC](https://community.glideapps.com/t/cards-with-rich-text/36273/12 "2021-12-29T17:15:21Z")
if i remember good, this is for the tiles, not cards… try to change inline list settings ---
**Author:** ![SantiagoPerez](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/santiagoperez/32/16807_2.png) [@SantiagoPerez](https://community.glideapps.com/u/SantiagoPerez)\ **Post date:** [December 29, 2021, 5:15pm UTC](https://community.glideapps.com/t/cards-with-rich-text/36273/13 "2021-12-29T17:15:43Z")
You can achieve this by using cloudinary. [Add a text to an image | Cloudinary Cookbook](https://cloudinary.com/cookbook/add_a_text_to_an_image) It may be a little confusing at the beginning but there are some good tutorials in the forum. Just browse for cloudinary text overlay. ---
**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:** [December 29, 2021, 11:53pm UTC](https://community.glideapps.com/t/cards-with-rich-text/36273/14 "2021-12-29T23:53:22Z")
I second this. Once you get it to work it’s easier than having CSS for this use case.