# Is there any way to give individual blocks of "Big Numbers" components background colour? **URL:** \ **Category:** Ask for Help\ **Created:** [February 8, 2024, 4:05am UTC](https://community.glideapps.com/t/is-there-any-way-to-give-individual-blocks-of-big-numbers-components-background-colour/70612 "2024-02-08T04:05:51Z")\ **Posts on this page:** 14\ **Page:** 1
**Author:** ![Dilip\_Adiga](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/dilip_adiga/32/60330_2.png) [@Dilip\_Adiga](https://community.glideapps.com/u/Dilip_Adiga)\ **Post date:** [February 8, 2024, 4:05am UTC](https://community.glideapps.com/t/is-there-any-way-to-give-individual-blocks-of-big-numbers-components-background-colour/70612/1 "2024-02-08T04:05:51Z")
Hi Guys, I use big Numbers component to display some numeric and text data. I will be using 4-5 individual elements in each of the component. I would want to make it colourful by giving different colours to individual Items to make it more appealing. Is it possible to do that in glide? If not what is the alternative? Please find the screenshot attached with markings to show where I need background colour Regards, Dilip ![Screenshot 2024-02-08 at 9.33.24 AM](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/d/6/d6cb120d84425ccd5f8827228707775b04e13ae6.png) ---
**Author:** ![Darren\_Murphy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_murphy/32/47326_2.png) [@Darren\_Murphy](https://community.glideapps.com/u/Darren_Murphy)\ **Post date:** [February 8, 2024, 4:15am UTC](https://community.glideapps.com/t/is-there-any-way-to-give-individual-blocks-of-big-numbers-components-background-colour/70612/2 "2024-02-08T04:15:38Z")
If you have a Business Plan, it might be possible with CSS. A simpler (and more dynamic) option would be to use a different component type - maybe a grid or card collection - and use something like [dummyimage.com](http://dummyimage.com) to generate images with the numbers in them. ---
**Author:** ![Dilip\_Adiga](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/dilip_adiga/32/60330_2.png) [@Dilip\_Adiga](https://community.glideapps.com/u/Dilip_Adiga)\ **Post date:** [February 8, 2024, 4:28am UTC](https://community.glideapps.com/t/is-there-any-way-to-give-individual-blocks-of-big-numbers-components-background-colour/70612/3 "2024-02-08T04:28:21Z")
Thank you for the reply Darren I just need Numbers box background colours to be different. Wouldnt the approach you mentioned mean that numbers have to be fixed or static ? These numbers are dynamic in nature as they keep updating. If it will work could you give me more details and help me out? Regards, Dilip ---
**Author:** ![Darren\_Murphy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_murphy/32/47326_2.png) [@Darren\_Murphy](https://community.glideapps.com/u/Darren_Murphy)\ **Post date:** [February 8, 2024, 5:55am UTC](https://community.glideapps.com/t/is-there-any-way-to-give-individual-blocks-of-big-numbers-components-background-colour/70612/4 "2024-02-08T05:55:09Z")
Use a template column to construct the image URL. This can include dynamic replacements for the foreground colour, background colour, and the text/number. And then use the images in whatever component fits your use case. ![CleanShot 2024-02-08 at 13.56.37@2x](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/7/9/796e5587b003e8c7cd7c66718d959c82e90f2352.png) ![CleanShot 2024-02-08 at 13.56.27@2x](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/5/a/5a9d597f9b95b7d23ebee6c0398195305cae4367.jpeg) ---
**Author:** ![Dilip\_Adiga](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/dilip_adiga/32/60330_2.png) [@Dilip\_Adiga](https://community.glideapps.com/u/Dilip_Adiga)\ **Post date:** [February 8, 2024, 6:11am UTC](https://community.glideapps.com/t/is-there-any-way-to-give-individual-blocks-of-big-numbers-components-background-colour/70612/5 "2024-02-08T06:11:09Z")
Thank you Darren for your reply. My issues is the page already has multiple components and the components are pulling data from “Table A” which has multiple rows and in one of the column it has the value for each of the boxes. **how would** ![Screenshot 2024-02-08 at 11.37.42 AM](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/7/f/7f251ae42f5375b5dbce399ed9990332a6f66668.jpeg) **I be able to create rows with name Leads , Discussion, Confirmed inside this table?** and secondly do you mean to say **I create a container and inside container I create a grid?** Attaching my database screenshot too for reference ![Screenshot 2024-02-08 at 11.40.42 AM](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/e/b/ebe018c09f8ff873744746be167635fd72c8ab19.jpeg) ---
**Author:** ![Darren\_Murphy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_murphy/32/47326_2.png) [@Darren\_Murphy](https://community.glideapps.com/u/Darren_Murphy)\ **Post date:** [February 8, 2024, 6:19am UTC](https://community.glideapps.com/t/is-there-any-way-to-give-individual-blocks-of-big-numbers-components-background-colour/70612/6 "2024-02-08T06:19:02Z")
The grid in my example was just to demonstrate. There are so many different ways to do this. But if you want to use my suggestion and display the numbers in a collection, then you just need to organise the data into rows instead of columns. This could be as simple as creating a separate table with one row per data point, and then use single value columns to pull in the data, and use that table as the source of the collection. ---
**Author:** ![Dilip\_Adiga](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/dilip_adiga/32/60330_2.png) [@Dilip\_Adiga](https://community.glideapps.com/u/Dilip_Adiga)\ **Post date:** [February 8, 2024, 6:43am UTC](https://community.glideapps.com/t/is-there-any-way-to-give-individual-blocks-of-big-numbers-components-background-colour/70612/7 "2024-02-08T06:43:14Z")
Thank you for the explanation Darren. I will try this and get back to you. Regards, Dilip ---
**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:** [February 9, 2024, 12:37am UTC](https://community.glideapps.com/t/is-there-any-way-to-give-individual-blocks-of-big-numbers-components-background-colour/70612/8 "2024-02-09T00:37:11Z")
> [@Darren\_Murphy](#): > > If you have a Business Plan, it might be possible with CSS. ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/9/5/95909480e8f5a21f504bc2fd3f634e187e2e8ab7.png) Yes, I have done it before. ---
**Author:** ![Dilip\_Adiga](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/dilip_adiga/32/60330_2.png) [@Dilip\_Adiga](https://community.glideapps.com/u/Dilip_Adiga)\ **Post date:** [February 9, 2024, 11:39am UTC](https://community.glideapps.com/t/is-there-any-way-to-give-individual-blocks-of-big-numbers-components-background-colour/70612/9 "2024-02-09T11:39:18Z")
is this what you have done with business plan? Regards, Dilip ---
**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:** [February 9, 2024, 12:14pm UTC](https://community.glideapps.com/t/is-there-any-way-to-give-individual-blocks-of-big-numbers-components-background-colour/70612/10 "2024-02-09T12:14:47Z")
Yes, only on business/enterprise with CSS. ---
**Author:** ![abdo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/abdo/32/36540_2.png) [@abdo](https://community.glideapps.com/u/abdo)\ **Post date:** [February 20, 2024, 4:33am UTC](https://community.glideapps.com/t/is-there-any-way-to-give-individual-blocks-of-big-numbers-components-background-colour/70612/11 "2024-02-20T04:33:37Z")
What is the class? StyledDiv2 seems not to be working ---
**Author:** ![abdo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/abdo/32/36540_2.png) [@abdo](https://community.glideapps.com/u/abdo)\ **Post date:** [February 20, 2024, 4:39am UTC](https://community.glideapps.com/t/is-there-any-way-to-give-individual-blocks-of-big-numbers-components-background-colour/70612/12 "2024-02-20T04:39:25Z")
actually no need for class name this worked .dashboard .projects{ background-color: #efeffb; } just the custom class name you put for the big numbers componenet & the custom class name for the big number box ---
**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:** [February 20, 2024, 11:38pm UTC](https://community.glideapps.com/t/is-there-any-way-to-give-individual-blocks-of-big-numbers-components-background-colour/70612/13 "2024-02-20T23:38:29Z")
Yeah, I never use default class names when I need to target specific components like this case. ---
**Author:** ![Dilip\_Adiga](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/dilip_adiga/32/60330_2.png) [@Dilip\_Adiga](https://community.glideapps.com/u/Dilip_Adiga)\ **Post date:** [February 21, 2024, 11:00am UTC](https://community.glideapps.com/t/is-there-any-way-to-give-individual-blocks-of-big-numbers-components-background-colour/70612/14 "2024-02-21T11:00:55Z")
Hi Darren, I could perfectly achieve what you have explained above. Its awesome. But By using your above idea of using Demopage, Can we play around with font size or font type of the text inside? Regards, Dilip