surface panel border glow premium premium Tailwind cards and settings panels feature callouts with a more elevated material edge dashboard or marketing panels that need a refined perimeter flat cards need more material definition simple borders look too generic on premium surfaces want a subtle highlight edge without a heavy neon treatment
Rim Highlight Panel
Fetch snippet JSON:
curl https://webspire.de/snippets/surfaces/rim-highlight-panel.json Premium Plan
Rim Highlight Panel
Perimeter light hit and ambient glow — no border, just edge definition.
Surfaces
Glow
Background
Customize
Quick Start
<article class="rim-highlight-panel relative rounded-[1.5rem] bg-slate-950/80 p-6 text-white">...</article>Details
- Tailwind
- v4.x
- Browser
- baseline-2024
- Size
- 1296 bytes · 55 lines
- Custom Properties
-
--rim-highlight-color--rim-highlight-shadow - Classes
-
.rim-highlight-panel
surface panel border glow premium
This is a more refined surface treatment for Tailwind cards. It adds a faint perimeter highlight and a low ambient glow, which is often enough to make a premium panel feel intentional without turning it into a lighting effect.