Kubestronaut — Golden

/* Rotating ring animation */ @keyframes rotateRing { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Kubestronaut Golden Badge</title> <style> * { margin: 0; padding: 0; box-sizing: border-box; } kubestronaut golden

<circle cx="100" cy="100" r="92" fill="none" stroke="url(#goldGradient)" stroke-width="6" filter="url(#glow)"/> <circle cx="100" cy="100" r="84" fill="none" stroke="url(#darkGold)" stroke-width="2"/>  <g fill="#FFD700"> <circle cx="100" cy="12" r="2.5"/> <circle cx="100" cy="188" r="2.5"/> <circle cx="12" cy="100" r="2.5"/> <circle cx="188" cy="100" r="2.5"/> <circle cx="38" cy="38" r="2"/> <circle cx="162" cy="38" r="2"/> <circle cx="38" cy="162" r="2"/> <circle cx="162" cy="162" r="2"/> </g> /* Rotating ring animation */ @keyframes rotateRing {

<g fill="#FFD700"> <polygon points="70,70 72,66 74,70 78,70 75,73 76,77 72,75 68,77 69,73 66,70" /> <polygon points="130,70 132,66 134,70 138,70 135,73 136,77 132,75 128,77 129,73 126,70" /> <polygon points="70,130 72,126 74,130 78,130 75,133 76,137 72,135 68,137 69,133 66,130" /> <polygon points="130,130 132,126 134,130 138,130 135,133 136,137 132,135 128,137 129,133 126,130" /> </g> } 100% { transform: rotate(360deg)