5071ad4ba9
Full rewrite of docs/index.html + style.css + new app.js + OG card.
Hero
- Animated gradient mesh background (3 drifting blurred blobs;
respects prefers-reduced-motion).
- Space Grotesk display wordmark with subtle white→gray gradient.
- Eyebrow chip with pulsing dot showing current release.
- Type-on-load install command with blinking cursor in a faux-terminal
chrome (traffic-light dots, title bar, copy button).
- Stats row that counts up from 0 on first paint: 31 modules, 10 KEV,
119 detection rules, 88 tests.
- Primary CTA + secondary 'See --explain in action' + GitHub link.
Trust strip
- 'Grounded in authoritative sources' row: CISA KEV, NVD CVE API,
MITRE ATT&CK, kernel.org stable tree, Debian Security Tracker,
NIST CWE. Establishes the federal-data-source provenance.
--explain showcase (flagship section)
- Big terminal mockup that types out a real --explain nf_tables run
line-by-line on scroll-into-view (45-95ms per line, easing).
- Four annotation cards explaining each part: triage metadata,
host fingerprint, detect() trace, OPSEC footprint.
Bento grid (8 feature cards in a varied 3-col layout)
- Auto-pick safest exploit (large card with code sample)
- 119 detection rules (with animated per-format coverage bars)
- CISA KEV prioritized (red-accented)
- OPSEC notes per exploit
- One host fingerprint, every module (large card with struct excerpt)
- JSON for pipelines
- No SaaS, no telemetry
- Verifier ready (Vagrant + Parallels)
Module corpus
- Same green/yellow split as before, but every KEV-listed module pill
now carries a ★ prefix + red-tinted border so 'actively exploited
in the wild' is visible at a glance.
Audience
- 4 colored cards (red/blue/gray/purple) — pentesters, SOC, sysadmins,
researchers — each with a deep link to the right doc.
Verified-vs-claimed honesty callout
- Featured gradient-bordered card restating the no-fabricated-offsets
bar. ✓ icon, project's defining trust claim.
Quickstart
- Tabbed: install / scan / explain / auto / detect-rules. Each tab is
a short, copy-ready snippet with inline comments.
Roadmap timeline
- Three columns: shipped / in flight / next. Shipped lists every
feature from the last several sessions (--explain, OPSEC, CWE/
ATT&CK/KEV pipeline, 119 rules, host refactor, 88 tests, drift
detector, VM scaffold). Next lists arm64 musl, mass-fleet
aggregator, SIEM query templates, CI hardening.
Footer
- Four-column gradient footer (Brand / Project / Docs / Ethics) +
bottom bar with credits to original PoC authors + license + repo
link.
Tech
- Typography: Inter (UI) + JetBrains Mono (code) + Space Grotesk
(display wordmark), all via Google Fonts with display=swap.
- Palette: deep purple-tinted dark (#07070d) + emerald accent
(#10b981) + cyan secondary (#06b6d4) + KEV-red (#ef4444) +
violet (#a855f7) for threat-intel framing.
- CSS: ~28KB unminified, custom-properties driven; gracefully
degrades to single-column on every grid section at narrow widths.
- JS: ~8KB vanilla, no frameworks. Respects prefers-reduced-motion
everywhere. IntersectionObserver-driven scroll reveal and
stat-count-up.
- OG image: hand-authored SVG → rsvg-convert → 1200x630 PNG
(121KB). Renders cleanly when shared on Twitter/LinkedIn/Slack.
- 4 new files: app.js, og.svg, og.png; rewrites: index.html, style.css.
Refreshed content:
- v0.5.0 → v0.6.0 throughout.
- '28 verified modules' → 31.
- Adds KEV cross-ref, --explain, OPSEC, ATT&CK/CWE callouts that
didn't exist in the previous version.
HTML structure validated balanced (Python html.parser smoke test).
81 lines
3.6 KiB
XML
81 lines
3.6 KiB
XML
<?xml version="1.0" encoding="UTF-8"?>
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="630" viewBox="0 0 1200 630">
|
|
<defs>
|
|
<linearGradient id="bg" x1="0" y1="0" x2="1" y2="1">
|
|
<stop offset="0" stop-color="#07070d"/>
|
|
<stop offset="1" stop-color="#0c0c16"/>
|
|
</linearGradient>
|
|
<linearGradient id="brand" x1="0" y1="0" x2="1" y2="0">
|
|
<stop offset="0" stop-color="#10b981"/>
|
|
<stop offset="1" stop-color="#06b6d4"/>
|
|
</linearGradient>
|
|
<radialGradient id="glow1" cx="0.2" cy="0.3" r="0.6">
|
|
<stop offset="0" stop-color="#10b981" stop-opacity="0.18"/>
|
|
<stop offset="1" stop-color="#10b981" stop-opacity="0"/>
|
|
</radialGradient>
|
|
<radialGradient id="glow2" cx="0.85" cy="0.8" r="0.5">
|
|
<stop offset="0" stop-color="#a855f7" stop-opacity="0.16"/>
|
|
<stop offset="1" stop-color="#a855f7" stop-opacity="0"/>
|
|
</radialGradient>
|
|
</defs>
|
|
|
|
<!-- backgrounds -->
|
|
<rect width="1200" height="630" fill="url(#bg)"/>
|
|
<rect width="1200" height="630" fill="url(#glow1)"/>
|
|
<rect width="1200" height="630" fill="url(#glow2)"/>
|
|
|
|
<!-- diamond mark -->
|
|
<g transform="translate(80,140)">
|
|
<rect x="0" y="0" width="36" height="36" transform="rotate(45 18 18)" fill="url(#brand)"/>
|
|
</g>
|
|
|
|
<!-- wordmark -->
|
|
<text x="142" y="170" font-family="'Space Grotesk','Inter',sans-serif" font-weight="700" font-size="68" fill="#ecedf7" letter-spacing="-2">
|
|
SKELETONKEY
|
|
</text>
|
|
|
|
<!-- tagline -->
|
|
<text x="80" y="240" font-family="'Inter',sans-serif" font-size="32" fill="#c5c5d3" font-weight="500">
|
|
Curated Linux LPE corpus.
|
|
</text>
|
|
<text x="80" y="282" font-family="'Inter',sans-serif" font-size="32" fill="#c5c5d3" font-weight="500">
|
|
SOC-ready detection in the box.
|
|
</text>
|
|
|
|
<!-- stat chips -->
|
|
<g transform="translate(80,360)">
|
|
<!-- 31 modules -->
|
|
<rect x="0" y="0" width="220" height="58" rx="29" fill="#161628" stroke="#25253c"/>
|
|
<text x="32" y="38" font-family="'JetBrains Mono',monospace" font-weight="700" font-size="22" fill="#ecedf7">31</text>
|
|
<text x="68" y="37" font-family="'Inter',sans-serif" font-size="16" fill="#8a8a9d">modules</text>
|
|
|
|
<!-- 10 KEV -->
|
|
<rect x="238" y="0" width="220" height="58" rx="29" fill="#161628" stroke="#ef4444" stroke-opacity="0.4"/>
|
|
<text x="270" y="38" font-family="'JetBrains Mono',monospace" font-weight="700" font-size="22" fill="#ef4444">10</text>
|
|
<text x="306" y="37" font-family="'Inter',sans-serif" font-size="16" fill="#8a8a9d">★ in CISA KEV</text>
|
|
|
|
<!-- 119 rules -->
|
|
<rect x="476" y="0" width="240" height="58" rx="29" fill="#161628" stroke="#25253c"/>
|
|
<text x="508" y="38" font-family="'JetBrains Mono',monospace" font-weight="700" font-size="22" fill="#ecedf7">119</text>
|
|
<text x="554" y="37" font-family="'Inter',sans-serif" font-size="16" fill="#8a8a9d">detection rules</text>
|
|
</g>
|
|
|
|
<!-- terminal mockup -->
|
|
<g transform="translate(80,478)">
|
|
<rect x="0" y="0" width="1040" height="92" rx="12" fill="#0a0a14" stroke="#25253c"/>
|
|
<!-- bar -->
|
|
<circle cx="22" cy="22" r="6" fill="#ff5f57"/>
|
|
<circle cx="42" cy="22" r="6" fill="#febc2e"/>
|
|
<circle cx="62" cy="22" r="6" fill="#28c840"/>
|
|
<line x1="0" y1="44" x2="1040" y2="44" stroke="#1c1c2d"/>
|
|
<text x="24" y="78" font-family="'JetBrains Mono',monospace" font-size="20" fill="#ecedf7">
|
|
<tspan fill="#10b981">$</tspan> skeletonkey --explain nf_tables <tspan fill="#5b5b75"># operator briefing in one command</tspan>
|
|
</text>
|
|
</g>
|
|
|
|
<!-- subtle url at very bottom -->
|
|
<text x="1120" y="610" font-family="'JetBrains Mono',monospace" font-size="14" fill="#5b5b75" text-anchor="end">
|
|
karazajac.github.io/SKELETONKEY
|
|
</text>
|
|
</svg>
|