Bohr Atom (SVG)
Stylised Bohr model — nucleus + electron shells.
Rendering…
Make it your own.
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 360 360" width="480">
<defs>
<radialGradient id="nuc" cx="50%" cy="50%" r="50%">
<stop offset="0%" stop-color="#fde68a"/>
<stop offset="100%" stop-color="#b45309"/>
</radialGradient>
</defs>
<g fill="none" stroke="#94a3b8" stroke-width="1.2">
<circle cx="180" cy="180" r="50"/>
<circle cx="180" cy="180" r="90"/>
<circle cx="180" cy="180" r="130"/>
</g>
<circle cx="180" cy="180" r="18" fill="url(#nuc)" stroke="#7f1d1d"/>
<text x="180" y="184" font-family="Inter" font-size="11" text-anchor="middle" fill="white">12C</text>
<g fill="#1f47f5" stroke="#0f172a" stroke-width="1">
<circle cx="230" cy="180" r="5"/>
<circle cx="130" cy="180" r="5"/>
<circle cx="180" cy="90" r="5"/>
<circle cx="180" cy="270" r="5"/>
<circle cx="240" cy="240" r="5"/>
<circle cx="120" cy="120" r="5"/>
</g>
<text x="180" y="20" font-family="Inter" font-size="14" font-weight="600" text-anchor="middle" fill="#0f172a">Bohr model — Carbon</text>
<text x="240" y="170" font-family="Inter" font-size="10" fill="#475569">1s²</text>
<text x="265" y="105" font-family="Inter" font-size="10" fill="#475569">2s² 2p²</text>
</svg>