Qaid
ARTICLE

Public Theme Gallery: Share Your Designs

Browse community themes, apply them to your projects, and share your own custom designs.

Qaid Team

Somebody has already built the theme you are about to build. The gallery at /themes is where those end up, and where yours goes if you want it there.

Browsing

Go to /themes. Every card carries a live preview of the buttons, the theme name, when it was published, and who made it.

Finding one

One grid, everything published, newest first. There is no search and no categories, which is fine at this size. Click a card and it loads into the customizer below the grid, where you can look at it properly next to the controls.

That customizer is the same Create Your Own builder you would start from scratch with: colours, icons, sizing, CSS, live preview, and a Code Output panel to copy from.

Modern Glass

A popular community theme with glassmorphism effects

Loading embed...

A published theme carries its CSS, its colour configuration and any custom icons, so there is nothing else to go and find.

Using one

Two steps.

Load it

Click the card. Colours, icons, CSS, button class and any custom text all populate the customizer, and the preview updates as you change them.

Copy two things

The Code Output panel under the preview gives you both:

1. CSS Styles

The CSS goes in your stylesheet or a <style> tag:

.qaid-theme-ocean {
  background: linear-gradient(135deg, #0077b6 0%, #00b4d8 100%);
  border: none;
  border-radius: 8px;
  padding: 10px 14px;
  color: white;
  transition: all 0.2s ease;
  box-shadow: 0 2px 8px rgba(0, 119, 182, 0.3);
}

.qaid-theme-ocean:hover {
  transform: scale(1.05);
  box-shadow: 0 4px 16px rgba(0, 119, 182, 0.4);
}

.qaid-theme-ocean.qaid-btn-up {
  background: linear-gradient(135deg, #06d6a0 0%, #1b9aaa 100%);
}

.qaid-theme-ocean.qaid-btn-down {
  background: linear-gradient(135deg, #ef476f 0%, #f78c6b 100%);
}

2. embed Configuration

And the config points the embed at the theme's class:

<script
  src="https://unpkg.com/@qaiddev/thumbs-embed/dist/embed.js"
  data-endpoint="/api/feedback"
  data-button-class="qaid-theme-ocean"
  data-positive-color="#06d6a0"
  data-negative-color="#ef476f"
  data-marker-color="#0077b6"
></script>

Ocean Theme

Gradient blues inspired by the sea

Loading embed...

Change it first

Nothing about a published theme is locked. Swap the colours, change the icons, resize the buttons, rewrite the CSS. Code Output tracks whatever you do, so what you paste is your version.

Publishing yours

Before you do

Four things worth getting right:

Give the class a distinctive prefix like .qaid-theme-yourname, because two themes claiming .qaid-fancy will collide in somebody's stylesheet. Style default, hover and active for both buttons, since a theme that only handles the resting state looks unfinished the first time anyone points at it. Check your colours hit 4.5:1 against the surface behind them. And strip out anything specific to your own project before you share it.

Publishing it

Save the theme to your project's Saved Themes strip under a name that describes it. Each saved card has a small globe icon top-left. Click it and the theme goes public: the icon turns green, a green dot appears by the name, and it is in the gallery. Click again to pull it back.

The name is the only metadata that travels with it, alongside the CSS, button class, icons, colours, sizing and text overrides. There is no description field, no category, no tags, so the name has to do that work.

Sunset

An example of a published community theme

Loading embed...

Public or private, nothing between

A private theme stays in your own Saved Themes strip and nobody else sees it. A public one is in the gallery for anyone to load.

The globe icon flips it either way at any time. Going private pulls it from the gallery straight away.

Updating one

Edit in the customizer and save. Nothing syncs outward, because the gallery hands out snippets that people paste into their own sites. Everyone who copied the old version keeps it. Only people loading it after your edit get the new one.

House rules

Publish work you made or have permission to share. Name it so somebody scrolling the grid can tell what it is. And if you built on top of someone else's theme, say so in the name.

Where to start

Open /themes, load whichever card is closest to your brand, and change it until it is not that theme any more. Then publish it, because the person after you is about to do the same thing from scratch.

Back to all articles