# Beta: Share & reuse AI Custom components

**URL:** https://community.glideapps.com/t/beta-share-reuse-ai-custom-components/81038
**Category:** Archived Announcements
**Tags:** ai, layout, ai-custom
**Created:** [March 28, 2025, 1:58pm UTC](https://community.glideapps.com/t/beta-share-reuse-ai-custom-components/81038 "2025-03-28T13:58:31Z")
**Posts on this page:** 15
**Page:** 1

<div class="post-metadata">

### Author: ![NoCodeAndy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/nocodeandy/32/62530_2.png) [@NoCodeAndy](https://community.glideapps.com/u/NoCodeAndy)
#### Post date: [March 28, 2025, 1:58pm UTC](https://community.glideapps.com/t/beta-share-reuse-ai-custom-components/81038/1 "2025-03-28T13:58:31Z")

</div>

**We’re testing a new capability to let you share, reuse, and import `AI Custom` components between Glide apps.**

Here’s a quick demo from Christian, our lead designer on the project:

[https://www.loom.com/share/6395eb2ca992427199958f222e58f81e](https://www.loom.com/share/6395eb2ca992427199958f222e58f81e)

The feature is in `Public Beta`. Our team is watching this thread, so please give it a try, and reply with whatever feedback you have.

Learn more in our [Glide docs for the AI Custom component](https://www.glideapps.com/docs/essentials/components/ai-custom#sharing-and-importing-ai-custom-components):

> **[AI Custom | Glide Docs](https://www.glideapps.com/docs/essentials/components/ai-custom#sharing-and-importing-ai-custom-components)**
>
> Design new components through prompts.

Thank you! 🙏

---

<div class="post-metadata">

### Author: ![MaximeBaker](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/maximebaker/32/80877_2.png) [@MaximeBaker](https://community.glideapps.com/u/MaximeBaker)
#### Post date: [March 28, 2025, 2:21pm UTC](https://community.glideapps.com/t/beta-share-reuse-ai-custom-components/81038/3 "2025-03-28T14:21:19Z")

</div>

This would fit perfectly in @John_Romano’s app: [https://ailibrary.glide.page](https://ailibrary.glide.page)

---

<div class="post-metadata">

### Author: ![MattLB](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/mattlb/32/41284_2.png) [@MattLB](https://community.glideapps.com/u/MattLB)
#### Post date: [March 28, 2025, 2:55pm UTC](https://community.glideapps.com/t/beta-share-reuse-ai-custom-components/81038/4 "2025-03-28T14:55:27Z")

</div>

Now we need a library and potentially a marketplace.

Also - @ThinhDinh , I used your implementation of this feature back in the day…remember your Social ribbon !?

---

<div class="post-metadata">

### Author: ![MaximeBaker](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/maximebaker/32/80877_2.png) [@MaximeBaker](https://community.glideapps.com/u/MaximeBaker)
#### Post date: [March 28, 2025, 4:01pm UTC](https://community.glideapps.com/t/beta-share-reuse-ai-custom-components/81038/5 "2025-03-28T16:01:08Z")

</div>

^ @John_Romano

---

<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: [March 28, 2025, 5:17pm UTC](https://community.glideapps.com/t/beta-share-reuse-ai-custom-components/81038/6 "2025-03-28T17:17:58Z")

</div>

This is very neat, thanks @Christian_G !

---

<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: [March 29, 2025, 3:56am UTC](https://community.glideapps.com/t/beta-share-reuse-ai-custom-components/81038/7 "2025-03-29T03:56:17Z")

</div>

> [@MattLB](#):
>
> Also - @ThinhDinh , I used your implementation of this feature back in the day…remember your Social ribbon !

Hehe, glad to have helped. It was an Experimental Code URL hosted on Github I believe.

---

<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: [March 29, 2025, 4:27am UTC](https://community.glideapps.com/t/beta-share-reuse-ai-custom-components/81038/8 "2025-03-29T04:27:55Z")

</div>

Just tried this. Kudos to the team, this is superb.

---

<div class="post-metadata">

### Author: ![Laurence\_Schuberth](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/laurence_schuberth/32/65729_2.png) [@Laurence\_Schuberth](https://community.glideapps.com/u/Laurence_Schuberth)
#### Post date: [April 3, 2025, 2:39pm UTC](https://community.glideapps.com/t/beta-share-reuse-ai-custom-components/81038/9 "2025-04-03T14:39:25Z")

</div>

OMG that is great ! I wish you could do that for workflows as well 😀

---

<div class="post-metadata">

### Author: ![slscustom.ru](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/slscustom.ru/32/77336_2.png) [@slscustom.ru](https://community.glideapps.com/u/slscustom.ru)
#### Post date: [April 5, 2025, 1:01pm UTC](https://community.glideapps.com/t/beta-share-reuse-ai-custom-components/81038/10 "2025-04-05T13:01:59Z")

</div>

Hi!  
Does some one have a link to Custom AI component which simply renders text with **Markdown**?  
Or prompt.  
I tried several but it renders with many scratches

---

<div class="post-metadata">

### Author: ![Christian\_G](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/christian_g/32/39858_2.png) [@Christian\_G](https://community.glideapps.com/u/Christian_G)
#### Post date: [April 7, 2025, 6:31pm UTC](https://community.glideapps.com/t/beta-share-reuse-ai-custom-components/81038/11 "2025-04-07T18:31:35Z")

</div>

Why not using the Rich Text component?

---

<div class="post-metadata">

### Author: ![slscustom.ru](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/slscustom.ru/32/77336_2.png) [@slscustom.ru](https://community.glideapps.com/u/slscustom.ru)
#### Post date: [April 9, 2025, 6:29am UTC](https://community.glideapps.com/t/beta-share-reuse-ai-custom-components/81038/12 "2025-04-09T06:29:30Z")

</div>

Because i want to construct component with features which is not avalailbe in Rich text.  
For example select the part of the text and do action with selected text(actually ask AI to craft new one)

---

<div class="post-metadata">

### Author: ![MattLB](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/mattlb/32/41284_2.png) [@MattLB](https://community.glideapps.com/u/MattLB)
#### Post date: [April 21, 2026, 5:03pm UTC](https://community.glideapps.com/t/beta-share-reuse-ai-custom-components/81038/14 "2026-04-21T17:03:22Z")

</div>

Designed and built in Claude to be used as a Glide AI component. This is the Claude view:

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/b/0/b05aa5de0a94c69bace556b4b3fe88aae22f9e3f.png)

Translated into the AI component as a BadgeGrid. On large screens they display side-by-side. Needed a handful of tweaks for Action and Input data. Claude did a very nice job

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/5/e/5e2f3e0345a2704481e91cc22a50fd765922aeee.png)

---

<div class="post-metadata">

### Author: ![MattLB](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/mattlb/32/41284_2.png) [@MattLB](https://community.glideapps.com/u/MattLB)
#### Post date: [April 22, 2026, 1:48pm UTC](https://community.glideapps.com/t/beta-share-reuse-ai-custom-components/81038/15 "2026-04-22T13:48:27Z")

</div>

Here is where I landed in tweaking in Glide AI (standard big numbers below). The whitespace/padding is still a little much but better than the original. I could not get Glide to ‘hide’ a badge if the input data is empty to I will try in Claude if I can nuance this. But the BadgeGrid is coming together.

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/9/d/9dd2e658a4be588df6f99ddf4f6825ddbb3bc81a.png)

---

<div class="post-metadata">

### Author: ![MattLB](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/mattlb/32/41284_2.png) [@MattLB](https://community.glideapps.com/u/MattLB)
#### Post date: [April 22, 2026, 3:05pm UTC](https://community.glideapps.com/t/beta-share-reuse-ai-custom-components/81038/16 "2026-04-22T15:05:32Z")

</div>

Last update: Before and after. I have not updated the color or font but hiding Badge1, 2 or 3 works! (if it does not have a title that badge is hidden), Below is the Claude code I used in the AI component plus I added the Input data (title1,2,3; rank 1,2,3 etc) so it would map to my columns. Also with Claude Cowork it actually showed me a responsive preview for both LARGE and SMALL screens (below).

2 BADGES

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/9/e/9e7957c5cd437fa782c3a998f950564baed16935.png)

3 BADGES

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/5/d/5d7b8027c799e59c4d2ef9579187b347fc9fb726.png)

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/c/5/c5605037d4f1b1b739da49a0a66cc664229033de.png)

Here’s the updated Glide AI prompt reflecting all the changes:

Generate a responsive HTML badge grid using the inputs below. Only render a badge if its Title is not empty or blank. Badge 1 — Title: {{Title1}}, Rank: {{Rank1}}, Score: {{Score1}}, Description: {{Description1}} Badge 2 — Title: {{Title2}}, Rank: {{Rank2}}, Score: {{Score2}}, Description: {{Description2}} Badge 3 — Title: {{Title3}}, Rank: {{Rank3}}, Score: {{Score3}}, Description: {{Description3}} Layout rules: - Wrap all visible badges in a CSS grid container - Large screens (≥600px): up to 3 columns using grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)) - Small screens (\<600px): 1 column, badges stacked vertically - Use a media query for the breakpoint - Gap between badges: 16px - Max grid width: 680px, centered Badge design (apply to each visible badge only): - Rounded card (border-radius 10px), box-shadow: 0 3px 12px rgba(0,0,0,0.11), overflow hidden - Title section: background #E3F2FD, padding 8px 12px, centered, font-size 11px, font-weight 600, uppercase, letter-spacing 1px, color #333333 - Body section: background #ffffff, padding 12px 12px 14px, centered, flex column, gap 2px - Rank: font-size 14px, bold, color by value: ELITE or EXCEPTIONAL = #6A0DAD STRONG or EXCELLENT = #1565C0 GOOD or SOLID = #2E7D32 MODERATE or AVERAGE = #E65100 WEAK or POOR = #C62828 Default = #757575 - Score: font-size 42px, font-weight 800, color #1A1A1A, line-height 1, margin 2px 0 - Description: font-size 11px, margin-top 4px, color by content: Starts with “+” or contains “up” or “increase” = #2E7D32 Starts with “-” or contains “down” or “decrease” = #C62828 Otherwise = #757575 Return only raw HTML with an inline block for media queries. No explanations, no markdown, no code blocks.

Change Badge1 to Title1, Rank1, Score1 and Description1. Change Badge2 to Title2, Rank2, Score2 and Description2

Change Badge3 to Title3, Rank3, Score3 and Description3

---

<div class="post-metadata">

### Author: ![Federico\_Fleitas](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/federico_fleitas/32/77461_2.png) [@Federico\_Fleitas](https://community.glideapps.com/u/Federico_Fleitas)
#### Post date: [April 23, 2026, 3:57pm UTC](https://community.glideapps.com/t/beta-share-reuse-ai-custom-components/81038/17 "2026-04-23T15:57:15Z")

</div>

Hi:  
This team has reached its user limit. Please contact the app owner to resolve this issue
