# 🧩 DSRCT Wiki Inline Icon Reference Sheet All icons below are inline SVGs (no external sprite required). They render anywhere in Obsidian or on your Publish site. > [!info] Usage > Copy the entire `<a>…</a>` block under each label and paste it wherever you want the icon to appear. > Each is fully clickable, accessible (`aria-label`, `title`), and stylable with CSS. --- | Icon | Label | Copy-ready snippet | |------|--------|-------------------| | <svg class="wiki-icon" viewBox="0 0 24 24"><path d="M4 12c2 2 6 4 8 0s6-2 8 0"/><ellipse cx="12" cy="12" rx="8" ry="6"/></svg> | **Cellular Metabolism** | ```html <a class="icon-link" href="/topics/deregulating-cellular-metabolism" aria-label="Cellular Metabolism" title="Cellular Metabolism"> <svg class="wiki-icon" viewBox="0 0 24 24" role="img"> <ellipse cx="12" cy="12" rx="8" ry="6" /> <path d="M4 12c2 2 6 4 8 0s6-2 8 0" /> </svg> </a> ``` | | <svg class="wiki-icon" viewBox="0 0 24 24"><circle cx="6" cy="12" r="2"/><circle cx="18" cy="12" r="2"/><path d="M8 12h8M12 8v8" stroke-dasharray="2 2"/></svg> | **Cell Signalling** | ```html <a class="icon-link" href="/topics/cell-signalling" aria-label="Cell Signalling" title="Cell Signalling"> <svg class="wiki-icon" viewBox="0 0 24 24" role="img"> <circle cx="6" cy="12" r="2"/> <circle cx="18" cy="12" r="2"/> <path d="M8 12h8"/> <path d="M12 8v8" stroke-dasharray="2 2"/> </svg> </a> ``` | | <svg class="wiki-icon" viewBox="0 0 24 24"><path d="M5 5h6l-2 4h6l-2 4h6"/><circle cx="5" cy="5" r="1.5"/><circle cx="17" cy="13" r="1.5"/><circle cx="23" cy="13" r="1"/></svg> | **Molecular Pathway** | ```html <a class="icon-link" href="/topics/molecular-pathway" aria-label="Molecular Pathway" title="Molecular Pathway"> <svg class="wiki-icon" viewBox="0 0 24 24" role="img"> <path d="M5 5h6l-2 4h6l-2 4h6"/> <circle cx="5" cy="5" r="1.5"/> <circle cx="17" cy="13" r="1.5"/> <circle cx="23" cy="13" r="1"/> </svg> </a> ``` | | <svg class="wiki-icon" viewBox="0 0 24 24"><path d="M5 5c4 0 7 4 7 7s3 7 7 7"/><path d="M19 5c-4 0-7 4-7 7s-3 7-7 7"/></svg> | **Gene** | ```html <a class="icon-link" href="/topics/gene" aria-label="Gene" title="Gene"> <svg class="wiki-icon" viewBox="0 0 24 24" role="img"> <path d="M5 5c4 0 7 4 7 7s3 7 7 7"/> <path d="M19 5c-4 0-7 4-7 7s-3 7-7 7"/> </svg> </a> ``` | | <svg class="wiki-icon" viewBox="0 0 24 24"><path d="M4 8c3-3 5 3 8 0s5 3 8 0"/><path d="M4 16c3 3 5-3 8 0s5-3 8 0"/></svg> | **Protein** | ```html <a class="icon-link" href="/topics/protein" aria-label="Protein" title="Protein"> <svg class="wiki-icon" viewBox="0 0 24 24" role="img"> <path d="M4 8c3-3 5 3 8 0s5 3 8 0"/> <path d="M4 16c3 3 5-3 8 0s5-3 8 0"/> </svg> </a> ``` | | <svg class="wiki-icon" viewBox="0 0 24 24"><path d="M7 5c3 0 6 3 6 6s3 6 6 6"/><path d="M17 5c-3 0-6 3-6 6s-3 6-6 6"/><path d="M8 9h8M8 15h8"/></svg> | **DNA** | ```html <a class="icon-link" href="/topics/dna" aria-label="DNA" title="DNA"> <svg class="wiki-icon" viewBox="0 0 24 24" role="img"> <path d="M7 5c3 0 6 3 6 6s3 6 6 6"/> <path d="M17 5c-3 0-6 3-6 6s-3 6-6 6"/> <path d="M8 9h8M8 15h8"/> </svg> </a> ``` | | <svg class="wiki-icon" viewBox="0 0 24 24"><rect x="4" y="4" width="2" height="16" rx="1"/><path d="M6 12h6l3-3v6l-3-3"/></svg> | **Cell Surface Receptor** | ```html <a class="icon-link" href="/topics/cell-surface-receptor" aria-label="Cell Surface Receptor" title="Cell Surface Receptor"> <svg class="wiki-icon" viewBox="0 0 24 24" role="img"> <rect x="4" y="4" width="2" height="16" rx="1"/> <path d="M6 12h6l3-3v6l-3-3"/> </svg> </a> ``` | | <svg class="wiki-icon" viewBox="0 0 24 24"><circle cx="12" cy="12" r="6"/><circle cx="12" cy="8" r="1"/><circle cx="9" cy="14" r="1"/><circle cx="15" cy="14" r="1"/></svg> | **Epigenetic Regulation** | ```html <a class="icon-link" href="/topics/epigenetic-regulation" aria-label="Epigenetic Regulation" title="Epigenetic Regulation"> <svg class="wiki-icon" viewBox="0 0 24 24" role="img"> <circle cx="12" cy="12" r="6"/> <circle cx="12" cy="8" r="1"/> <circle cx="9" cy="14" r="1"/> <circle cx="15" cy="14" r="1"/> </svg> </a> ``` | | <svg class="wiki-icon" viewBox="0 0 24 24"><path d="M12 4l8 4v5c0 4-3 7-8 9-5-2-8-5-8-9V8l8-4z"/><path d="M9 12l2 2 4-4"/></svg> | **Resistance Mechanism** | ```html <a class="icon-link" href="/topics/resistance-mechanism" aria-label="Resistance Mechanism" title="Resistance Mechanism"> <svg class="wiki-icon" viewBox="0 0 24 24" role="img"> <path d="M12 4l8 4v5c0 4-3 7-8 9-5-2-8-5-8-9V8l8-4z"/> <path d="M9 12l2 2 4-4"/> </svg> </a> ``` | | <svg class="wiki-icon" viewBox="0 0 24 24"><path d="M5 12c2-5 12-5 14 0s-2 7-7 7-9-2-7-7z"/><path d="M8 10a2 2 0 1 0 0 4"/></svg> | **Phenotypic Plasticity** | ```html <a class="icon-link" href="/topics/phenotypic-plasticity" aria-label="Phenotypic Plasticity" title="Phenotypic Plasticity"> <svg class="wiki-icon" viewBox="0 0 24 24" role="img"> <path d="M5 12c2-5 12-5 14 0s-2 7-7 7-9-2-7-7z"/> <path d="M8 10a2 2 0 1 0 0 4"/> </svg> </a> ``` | --- > [!tip] CSS reminder > Keep this in your `publish.css` for styling consistency: > ```css > .wiki-icon { > width: 2.5em; > height: 2.5em; > stroke: currentColor; > fill: none; > stroke-width: 2; > stroke-linecap: round; > stroke-linejoin: round; > vertical-align: -0.3em; > transition: transform .15s ease, opacity .15s ease; > display: inline-block; > } > .icon-link { display: inline-flex; align-items: center; text-decoration: none; } > .icon-link:hover .wiki-icon { transform: translateY(-1px); opacity: .85; } > ``` --- ✅ **Next step:** If you like this structure, I can finish the rest of the set (Epigenetic → DSRCT Target) and provide a downloadable Markdown file so you can just drag it into your vault. Would you like me to complete all 18 inline icons in this same format?