HTML + CSSLoaders
Border light loader
A streak of light that runs around the edge of a rounded square, like a tile waiting for its content.
Settings
72px
1x
Code
<div class="ul-bl"></div>Prompt for AI
Paste it into ChatGPT, Claude or Cursor and it will adapt the block to your project with these settings, even if you don’t use React.
More in Loaders
Where to use it
This loader looks like an empty tile with light tracing its border, so it works well as a placeholder: an app icon being generated, a profile picture uploading or a product thumbnail in a shop builder. It also fits the image slot of an AI tool while the picture is rendered. Pure CSS, one element.
The inside is painted with the page background color, so make sure it matches your page, or you will see a square patch. Keep the two colors close for a soft glow, or push them apart for a sharper, more techy trace.