The "Icon" Logo

Your navigation icon, enlarged and given the "Showcase" treatment. Great for a minimal, clean look.

View Code

<div class="w-28 h-28 rounded-full bg-slate-800/60 border border-slate-700 flex items-center justify-center shadow-lg floating-logo">
  <img src="https://i.imgur.com/abFl1je.png" alt="BAGGED™ Icon Logo" class="w-full h-full object-cover rounded-full p-2 drop-shadow-[0_0px_35px_rgba(56,189,248,0.4)]">
</div>

The "Showcase" Look

A gentle up-and-down motion with the signature blue glow. This creates perfect brand consistency.

View Code

<div class="w-28 h-28 rounded-full bg-slate-800/60 border border-slate-700 flex items-center justify-center shadow-lg floating-logo">
  <img src="https://i.imgur.com/abFl1je.png" alt="BAGGED™ Logo" class="w-full h-full object-cover rounded-full p-2 drop-shadow-[0_0px_35px_rgba(56,189,248,0.4)]">
</div>

The "Pulse" Look

The circular background pulses with a blue glow, using the same effect as your navigation buttons.

View Code

<style>
  .pulsing-container { animation: pulse 2.5s infinite; }
</style>
<div class="w-28 h-28 rounded-full bg-slate-800/60 border border-slate-700 flex items-center justify-center shadow-lg pulsing-container">
  <img src="https://i.imgur.com/abFl1je.png" alt="BAGGED™ Logo" class="w-full h-full object-cover rounded-full p-2">
</div>

The "Dynamic Duo"

The most dynamic option. The logo floats up and down while the background simultaneously pulses.

View Code

<div class="w-28 h-28 rounded-full bg-slate-800/60 border border-slate-700 flex items-center justify-center shadow-lg floating-logo pulsing-container">
  <img src="https://i.imgur.com/abFl1je.png" alt="BAGGED™ Logo" class="w-full h-full object-cover rounded-full p-2">
</div>

The "Static Glow"

A simple, non-animated effect. A soft, permanent blue glow is added to the white circle. Clean and professional.

View Code

<div class="w-28 h-28 rounded-full bg-slate-800/60 border border-slate-700 flex items-center justify-center shadow-xl shadow-cyan-500/30">
  <img src="https://i.imgur.com/abFl1je.png" alt="BAGGED™ Logo" class="w-full h-full object-cover rounded-full p-2">
</div>

The "Bordered" Look

Adds a clean, dark border around the logo container for definition. Shown here with the float animation.

View Code

<div class="w-28 h-28 rounded-full bg-slate-800/60 border-2 border-slate-500 flex items-center justify-center shadow-lg floating-logo">
  <img src="https://i.imgur.com/abFl1je.png" alt="BAGGED™ Logo" class="w-full h-full object-cover rounded-full p-2">
</div>