Skip to content

AbdullahBakir97/cortex

Repository files navigation

Cortex — turn your GitHub into a cinematic neon brain skill atlas

Cortex Action v1   Live demo   Docs   Install

Profiles built Stars Latest version


Cortex turns your GitHub profile into an anatomically-accurate neon-rendered skill brain that pulses with your real activity, narrates itself in 3 languages, and updates daily — all from a 30-line YAML config.


Cortex anatomical neon brain — generated from examples/extreme.yml, 200+ Wikimedia anatomy paths recolored with a multi-stop neon gradient. Each lobe maps to a skill domain.

Live SVG — generated from examples/extreme.yml on every push. Open the 3D version to drag and rotate it.


✨ Why Cortex

There are dozens of profile README generators. Cortex is the only one that gives you:

  • 🧠 An actual neon brain — built from real Wikimedia anatomy (200+ paths), recolored with a multi-stop neon gradient that flows in real time. Each lobe maps to a skill domain you define.
  • 🌌 Interactive 3D version auto-published to your GitHub Pages — drag, rotate, zoom. Three.js + OrbitControls, no setup.
  • 🌍 Multilingual identity — type-out headlines in English, Deutsch, العربية, or any language Unicode supports. 30+ rotating lines per language.
  • ♾️ 50-line auto-updating widgets — terminal commands, philosophy mottos, current focus, yearly highlights, recent activity, latest releases, contribution graphs, PageSpeed scores, WakaTime stats, and more. All refreshed daily.
  • 🎨 4 cinematic SVG card systems — tech stack, current focus, yearly timeline, anatomical brain — composed with glassmorphism, breathing borders, traveling synapses, animated gradients.
  • 🚀 30-second install — one workflow file, one config file, no JS, no build step on your end. Ships as a GitHub Action.

🎨 What this generates

Every image below is the actual output from examples/extreme.yml. Refreshed on every push by .github/workflows/build-examples.yml — no screenshots, no fakes.

🧠 Brain — anatomical skill atlas  ·  brain-anatomical.svg · 42 KB · 200+ paths

Anatomical brain SVG with neon-rainbow gradient, each lobe labelled with a skill domain

🎴 Tech cards — six glassmorphism skill panels  ·  tech-cards.svg · 13 KB

Six glassmorphism cards arranged in a 3x2 grid, each one a brain region's tools and stats

📅 Yearly highlights — career timeline with LIVE pulse  ·  yearly-highlights.svg · 14 KB

Year-by-year career timeline with markers and a live-pulsing tag for the current year

📺 Current focus — Netflix-tile dashboard  ·  current-focus.svg · 14 KB

Six tiles in a 3x2 grid, each one a project the author is actively working on with a status pill and tech stack

🎖️ Skill badges — 4 shapes × 3 layouts × 4 animations  ·  badges.svg · ~16 KB

Row of pill-shaped badges with brand-colored gradients, monogram icons (PY, RS, TS, etc.), labels and seniority values, fading in with a stagger animation

The compact "skills strip" most profile READMEs need. Picks brand colors from 40+ built-in tech slugs (python, rust, aws, kubernetes, …) — or supply your own SVG path + hex color. Mix & match shapes (pill · hex · shield · circle), layouts (row · grid · marquee), animations (stagger · shimmer · pulse · static).

Hexagon grid of certification badges
hex grid — certifications, achievements
Heraldic shield badges scrolling horizontally
shield marquee — eye-catching hero strip
Round badges with monogram-only
circle static — minimal, accessibility-friendly
Pill badges with custom SVG path icons
custom SVG paths — bring your own glyph
cards:
  badges:
    enabled: true
    shape: pill          # pill | hex | shield | circle
    layout: row          # row | grid | marquee
    animation: stagger   # stagger | shimmer | pulse | static
    items:
      - { icon: python,     label: "Python",     value: "Senior" }
      - { icon: rust,       label: "Rust",       value: "85%" }
      - { icon: typescript, label: "TypeScript", value: "Senior" }
      - { icon: aws,        label: "AWS",        value: "Certified" }
      - { icon: docker,     label: "Docker",     value: "Daily" }
      # …or full custom:
      - { label: "Build", color: "#7C3AED", icon_svg: "M12 2L2 22h20z", href: "https://..." }
🌌 Mind-blowing widgets — 7 distinctive SVG generators  ·  v0.3 batch

Distinctive widgets that don't exist anywhere else. Each is a separate widget — enable them à la carte in your cortex.yml.

Synthwave horizon: receding neon grid, slatted sun, mountain silhouettes
🌅 synthwave-banner — 80s retro hero (4 palettes: outrun · sunset · neon · miami)
Constellation of skills as named stars in deep space with connection lines
🌌 skill-galaxy — stars + connections in deep-space / nebula / void
Polar chart with 6 axes and a translucent breathing polygon
📡 skill-radar — polar chart, breathing polygon, N axes
Subway-style metro map with 3 colored lines, stations at year positions, LIVE markers
🚇 code-roadmap — metro map of career tracks, LIVE pulse on current
GitHub-style 7x52 contribution grid with neon glow on bright cells
🟩 activity-heatmap — 7×52 grid, neon glow, 4 palettes, sequential reveal
Five isometric 3D cubes showing stats with subtle orbit animation
🧊 stat-cubes — isometric 3D blocks, label/value faces, gentle orbit
Beveled trophy cabinet with hexagonal mounted trophies, each with a glyph and date
🏆 achievement-wall — trophy cabinet with hex-mounted milestones
Twin sinusoidal strands with colored base-pair rungs labelled by top languages
🧬 code-dna — twin helix strands, colored language base-pairs
Stylized 2D globe with neon contribution pins at world locations
🌍 skill-globe — lat/lon grid + neon pins, hides back-side pins
Tag cloud of skills orbiting a glowing central core
✨ particle-cloud — labelled particles orbiting a glowing core
Spotify-style 'currently coding' card with album art, waveform, and progress bar
🎵 now-playing — Spotify-style "currently coding in" card
Row of skill badges
🎖️ badges — already shown above (4 shapes × 3 layouts × 4 animations)
Click to see config snippets for each
cards:
  synthwave:                                    # 80s hero banner
    enabled: true
    title:    "CORTEX"
    subtitle: "Cinematic profile generator"
    palette:  outrun                            # outrun | sunset | neon | miami

  galaxy:                                        # constellation of skills
    enabled: true
    background: nebula                           # deep-space | nebula | void
    stars:
      - { label: "Python", color: "#FFD23F", size: 6 }
      - { label: "Rust",   color: "#CE422B", size: 5 }
      - { label: "AWS",    color: "#FF9900", size: 5 }
    connections: [["Python","Rust"], ["Python","AWS"]]

  radar:                                         # polar chart
    enabled: true
    title: "Stack profile"
    breathe: true
    axes:
      - { label: "Backend",  value: 92 }
      - { label: "Frontend", value: 68 }
      - { label: "DevOps",   value: 78 }
      - { label: "Mobile",   value: 35 }
      - { label: "ML",       value: 55 }

  roadmap:                                       # subway-style career map
    enabled: true
    title: "Career roadmap"
    lines:
      - name: "Backend"
        color: "#22D3EE"
        stations:
          - { label: "Django",  year: 2020 }
          - { label: "FastAPI", year: 2022 }
          - { label: "Cortex",  year: 2026, is_current: true }

  heatmap:                                       # contribution grid
    enabled: true
    palette: neon-rainbow                        # neon-green | neon-cyan | neon-rainbow | rose
    glow:    true

  cubes:                                         # 3D stat blocks
    enabled: true
    cubes:
      - { label: "PRs",     value: "1.2k" }
      - { label: "Commits", value: "8.4k" }
      - { label: "Stars",   value: "3.1k" }

  trophies:                                      # achievement cabinet
    enabled: true
    title: "Achievements"
    columns: 4
    trophies:
      - { label: "First PR",      date: "2018", glyph: "★" }
      - { label: "1k Commits",    date: "2020", glyph: "🔥" }
      - { label: "AWS Certified", date: "2023", glyph: "☁" }

  dna:                                            # twin helix with language base-pairs
    enabled: true
    title: "Code DNA"
    languages: ["Python", "TypeScript", "Rust", "Go", "React", "SQL", "Bash", "Docker"]
    # colors: optional list, paired by index — defaults to jewel-tone palette

  globe:                                          # 2D globe + neon pins
    enabled: true
    rotate: true                                  # set false for reduced-motion
    pins:
      - { label: "Berlin",   lon: 13.4,  lat: 52.5 }
      - { label: "New York", lon: -74.0, lat: 40.7 }
      - { label: "Tokyo",    lon: 139.7, lat: 35.7 }
      # Pins on the back hemisphere (lon outside ±90) auto-hide.

  particles:                                      # drifting tag cloud
    enabled: true
    title: "Skill cloud"
    items:
      - { label: "Python",   weight: 2.6 }       # heavier = closer to center, bigger
      - { label: "Rust",     weight: 2.0 }
      - { label: "AWS",      weight: 1.6 }
      - { label: "Three.js", weight: 1.2 }

  now_playing:                                    # Spotify-style activity card
    enabled: true
    activity: "Coding"                            # the pill: CODING / DEBUGGING / BUILDING…
    language: "Python"                            # the "track title"
    project:  "Cortex v0.4"                       # the "artist line"
    progress: 0.62                                # 0.0 - 1.0 fill
    elapsed:  "1:24"
    duration: ""
⌨️ About typing — multilingual rotating headlines  ·  about-typing.svg · 16 KB

Animated typing SVG cycling through about-me lines in multiple languages

💬 Motto typing — philosophy lines on rotation  ·  motto-typing.svg · 17 KB

Animated typing SVG cycling through personal mottos and philosophy lines

✨ Animated divider  ·  animated-divider.svg · 1 KB

Thin animated gradient divider

Want to see other tiers? examples/standard.yml is the default for full-stack devs (~60 lines). examples/minimal.yml is the 10-line starting point. Both render to the same widget set above with smaller payloads.


🎨 What Cortex Generates — Examples & Recipes

Every preview below is a live SVG generated from your cortex.yml. Each widget has multiple example configurations — click any <details> to expand the variant and copy the snippet straight into your config. Full schema reference: packages/cortex-schema/schema.json.

Header Banner  ·  header-banner.svg  ·  4 examples

Header Banner

Wide animated banner with shaped edge — capsule-render replacement. Title, subtitle, drifting gradient.

Wave shape, drifting (default)

Header Banner — Wave shape, drifting (default)

Sine-wave bottom edge, jewel-tone gradient drifts left↔right on a 22s ease-in-out cycle.

cards:
  header:
    enabled: true
    shape: wave
    title: "Your Name"
    subtitle: "FULLSTACK · ENGINEER · BUILDER"
    height: 240
    animation: drift
Slice shape, pulsing

Header Banner — Slice shape, pulsing

Diagonal bottom edge with opacity pulse — minimalist, matches landing-page aesthetics.

cards:
  header:
    enabled: true
    shape: slice
    title: "Your Name"
    height: 220
    animation: pulse
Rect shape, static

Header Banner — Rect shape, static

No shaped edge, no animation — clean rectangular header for code-focused profiles.

cards:
  header:
    enabled: true
    shape: rect
    title: "Your Name"
    subtitle: "github.com/your-handle"
    height: 180
    animation: static
Custom color palette

Header Banner — Custom color palette

Override the default jewel-tones with your own gradient stops (3-5 hex colors recommended).

cards:
  header:
    enabled: true
    shape: wave
    title: "Your Name"
    height: 240
    animation: drift
    colors: ["#0D1117", "#1E3A8A", "#2563EB", "#0EA5E9", "#0D1117"]
Anatomical Brain  ·  brain-anatomical.svg  ·  5 examples

Anatomical Brain

200+ Wikimedia anatomy paths recolored with rose-family gradient, masked aurora flow, DNA helixes, electric arcs across 6 lobes.

Default neon-rainbow palette

Anatomical Brain — Default neon-rainbow palette

Six lobes mapped to skill domains, full atmospheric layers (aurora, particles, DNA, halos), 3D wobble enabled.

brand:
  palette: neon-rainbow
brain:
  enabled: true
  atmosphere:
    show_aura: true
    show_particles: true
    show_halos: true
    wobble: true
Cyberpunk palette

Anatomical Brain — Cyberpunk palette

Hot magenta + electric cyan + acid yellow — same brain anatomy, different vibe.

brand:
  palette: cyberpunk
brain:
  enabled: true
  atmosphere:
    show_aura: true
    show_particles: true
    wobble: true
Monochrome (atmosphere off)

Anatomical Brain — Monochrome (atmosphere off)

Subtle, professional single-accent rendering — atmospheric layers disabled for a code-focused look.

brand:
  palette: monochrome
brain:
  enabled: true
  atmosphere:
    show_aura: false
    show_particles: false
    show_halos: false
    wobble: false
Retro warm palette

Anatomical Brain — Retro warm palette

Warm 80s-inspired colors — orange/amber tones over rose body. Good for solo dev / indie hacker vibes.

brand:
  palette: retro
brain:
  enabled: true
  atmosphere:
    show_aura: true
    show_particles: true
    wobble: true
Minimal palette

Anatomical Brain — Minimal palette

Subtle neutrals + one warm accent — professional, understated, terminal-friendly.

brand:
  palette: minimal
brain:
  enabled: true
  atmosphere:
    show_aura: true
    show_particles: false
    show_halos: false
    wobble: true
Tech Stack Cards  ·  tech-cards.svg  ·  2 examples

Tech Stack Cards

6 glassmorphism cards in a 3x2 grid — one per brain region. Stacked drop shadows, traveling edge glow per card, inner color pulse.

With stats (default)

Tech Stack Cards — With stats (default)

Each card shows years/projects/mastery row plus an animated proficiency bar.

cards:
  tech_stack:
    enabled: true
    show_stats: true
Without stats — text-only

Tech Stack Cards — Without stats — text-only

Hide the years/projects/mastery row for a cleaner card focused on the tools list and tagline.

cards:
  tech_stack:
    enabled: true
    show_stats: false
Current Focus Tiles  ·  current-focus.svg  ·  2 examples

Current Focus Tiles

Netflix-style "now playing" tiles for active projects — status pill, live dot, traveling edge highlight, tile-rise stagger animation.

Single project tile

Current Focus Tiles — Single project tile

Just one focus area — the grid auto-reflows so a 1-tile config still looks polished.

cards:
  current_focus:
    enabled: true
    tiles:
      - project: "Cortex"
        status: SHIPPING
        accent: red
        emoji: "🧠"
        description: "Animated neon-brain README generator with 10 SVG widgets."
        tech: [Python, Pydantic, SVG, GitHub Actions]
Multiple tiles, mixed statuses + accents

Current Focus Tiles — Multiple tiles, mixed statuses + accents

Up to 6 tiles in a 3x2 grid. status: ACTIVE/SHIPPING/EXPLORING/MAINTAINING/BUILDING. accent: red/orange/green/gold/cyan/purple.

cards:
  current_focus:
    enabled: true
    tiles:
      - { project: "Cortex",     status: SHIPPING,    accent: red,    emoji: "🧠", description: "Profile README brain generator.",                       tech: [Python, SVG] }
      - { project: "Pydev",      status: BUILDING,    accent: orange, emoji: "🐍", description: "Local-first Python dev environment manager.",            tech: [Tauri, Vue, TypeScript] }
      - { project: "Skill DNA",  status: EXPLORING,   accent: cyan,   emoji: "🧬", description: "AI-driven skill atlas + portfolio generator.",            tech: [LangChain, RAG] }
      - { project: "Brain 3D",   status: MAINTAINING, accent: purple, emoji: "🌌", description: "Three.js viewer for the cortex brain.",                  tech: [Three.js, Vite] }
Synthwave Horizon  ·  synthwave-banner.svg  ·  3 examples

Synthwave Horizon

80s retro-futurist hero banner. Receding perspective grid, slatted neon sun, layered mountain silhouettes, atmospheric gradient. 4 palettes (outrun, sunset, neon, miami).

Outrun palette (default)

Synthwave Horizon — Outrun palette (default)

Purple-to-pink-to-yellow atmospheric gradient. Most iconic synthwave look.

cards:
  synthwave:
    enabled: true
    title: "CORTEX"
    subtitle: "Cinematic profile generator"
    palette: outrun
Miami vice palette

Synthwave Horizon — Miami vice palette

Cyan-pink-orange gradient that screams beachside neon.

cards:
  synthwave:
    enabled: true
    title: "BEACH MODE"
    palette: miami
Neon palette, no mountains

Synthwave Horizon — Neon palette, no mountains

Cleaner take — dark sky, bright sun, sharp grid. Good when overlaid by other content.

cards:
  synthwave:
    enabled: true
    title: "GRID"
    palette: neon
    show_mountains: false
Skill Galaxy  ·  skill-galaxy.svg  ·  2 examples

Skill Galaxy

Constellation of skills as named stars in a deep-space field, with optional connection lines between related techs. Each star twinkles on its own phase, the whole field drifts slowly. Three backgrounds: deep-space, nebula, void.

Deep space (default)

Skill Galaxy — Deep space (default)

Subtle radial gradient background, white stars, simple connections.

cards:
  galaxy:
    enabled: true
    title: "Skill galaxy"
    background: deep-space
    stars:
      - { label: "Python" }
      - { label: "Rust" }
      - { label: "TypeScript" }
      - { label: "React" }
      - { label: "AWS" }
      - { label: "PostgreSQL" }
      - { label: "Docker" }
      - { label: "Kubernetes" }
    connections:
      - ["Python", "Rust"]
      - ["Python", "PostgreSQL"]
      - ["TypeScript", "React"]
      - ["AWS", "Docker"]
      - ["Docker", "Kubernetes"]
Nebula background

Skill Galaxy — Nebula background

Three drifting colored radial blobs (violet, pink, cyan) layered behind the stars.

cards:
  galaxy:
    enabled: true
    title: "Stack universe"
    background: nebula
    stars:
      - { label: "Python", color: "#FFD23F", size: 6 }
      - { label: "Go",     color: "#22D3EE", size: 5 }
      - { label: "React",  color: "#FF6B9D", size: 5 }
      - { label: "AWS" }
      - { label: "Postgres" }
    connections: [["Python","AWS"],["React","AWS"]]
Skill Radar  ·  skill-radar.svg  ·  2 examples

Skill Radar

Polar chart with N axes, one per skill. Translucent polygon shows your level on each. Optional breathing animation pulses the polygon scale subtly.

5-axis pentagon

Skill Radar — 5-axis pentagon

Five core skills, classic pentagon shape, breathing on.

cards:
  radar:
    enabled: true
    title: "Stack profile"
    breathe: true
    axes:
      - { label: "Backend",   value: 90 }
      - { label: "Frontend",  value: 65 }
      - { label: "DevOps",    value: 75 }
      - { label: "Mobile",    value: 35 }
      - { label: "ML / Data", value: 55 }
6-axis hexagon, no breathing

Skill Radar — 6-axis hexagon, no breathing

Six axes for finer granularity; static for accessibility.

cards:
  radar:
    enabled: true
    title: "Skills"
    breathe: false
    color: "#22D3EE"
    axes:
      - { label: "Python",    value: 95 }
      - { label: "Rust",      value: 70 }
      - { label: "TS",        value: 80 }
      - { label: "AWS",       value: 78 }
      - { label: "Postgres",  value: 88 }
      - { label: "Docker",    value: 82 }
Code Roadmap  ·  code-roadmap.svg  ·  1 example

Code Roadmap

Metro/subway-style multi-line career map. Each line is a tech path; stations are milestones. Live-pulsing marker on the current station per line.

Career lines with year axis

Code Roadmap — Career lines with year axis

Three lines along a real year axis (2018-2026) with multiple stations and one LIVE marker.

cards:
  roadmap:
    enabled: true
    title: "Career roadmap"
    lines:
      - name: "Backend"
        color: "#22D3EE"
        stations:
          - { label: "Django",    year: 2019 }
          - { label: "FastAPI",   year: 2022 }
          - { label: "Cortex",    year: 2026, is_current: true }
      - name: "Frontend"
        color: "#FF6B9D"
        stations:
          - { label: "Vue 2",     year: 2020 }
          - { label: "React",     year: 2022 }
          - { label: "Three.js",  year: 2025, is_current: true }
      - name: "Cloud"
        color: "#FFD23F"
        stations:
          - { label: "AWS basics", year: 2021 }
          - { label: "K8s prod",   year: 2024, is_current: true }
Skill Badges  ·  badges.svg  ·  5 examples

Skill Badges

Compact skill / tech / achievement badges. 4 shapes (pill, hex, shield, circle) x 3 layouts (row, grid, marquee) x 4 animations (stagger, shimmer, pulse, static). Built-in monogram icons + custom SVG path support, per-badge brand color.

Pill row with values (default)

Skill Badges — Pill row with values (default)

Horizontal row of rounded-rectangle badges, each with icon monogram + label + value (e.g. Senior, 85%, Certified). Wraps when wider than the SVG.

cards:
  badges:
    enabled: true
    shape: pill
    layout: row
    animation: stagger
    items:
      - { icon: python,     label: "Python",      value: "Senior" }
      - { icon: rust,       label: "Rust",        value: "85%" }
      - { icon: typescript, label: "TypeScript",  value: "Senior" }
      - { icon: react,      label: "React",       value: "Mid" }
      - { icon: aws,        label: "AWS",         value: "Certified" }
      - { icon: docker,     label: "Docker",      value: "Daily" }
Hexagon grid

Skill Badges — Hexagon grid

Achievement / certificate vibe. Hexagons in a fixed N-column grid, label below each.

cards:
  badges:
    enabled: true
    shape: hex
    layout: grid
    columns: 6
    animation: shimmer
    items:
      - { icon: aws,        label: "AWS Pro" }
      - { icon: gcp,        label: "GCP Eng" }
      - { icon: azure,      label: "Az Solu" }
      - { icon: kubernetes, label: "CKA" }
      - { icon: terraform,  label: "TF Assoc" }
      - { icon: docker,     label: "Docker" }
Heraldic shields, scrolling marquee

Skill Badges — Heraldic shields, scrolling marquee

Power feature: badges scroll horizontally on a single line forever. Eye-catching for hero sections.

cards:
  badges:
    enabled: true
    shape: shield
    layout: marquee
    animation: static
    items:
      - { icon: python,     label: "Python" }
      - { icon: rust,       label: "Rust" }
      - { icon: go,         label: "Go" }
      - { icon: typescript, label: "TS" }
      - { icon: react,      label: "React" }
      - { icon: nodejs,     label: "Node" }
      - { icon: postgres,   label: "PostgreSQL" }
      - { icon: redis,      label: "Redis" }
Circle chips, no animation

Skill Badges — Circle chips, no animation

Most compact form — just an icon and a tiny label. Good for accessibility / reduced-motion users.

cards:
  badges:
    enabled: true
    shape: circle
    layout: row
    animation: static
    items:
      - { icon: python,     label: "Py" }
      - { icon: typescript, label: "TS" }
      - { icon: rust,       label: "Rs" }
      - { icon: go,         label: "Go" }
      - { icon: docker,     label: "Dk" }
      - { icon: kubernetes, label: "K8s" }
Custom SVG icons + custom colors

Skill Badges — Custom SVG icons + custom colors

Bypass the built-in monogram library by passing raw SVG path data normalized to a 24-unit canvas, plus an explicit hex color per badge.

cards:
  badges:
    enabled: true
    shape: pill
    layout: row
    animation: pulse
    items:
      - { label: "Custom A", color: "#F90001", icon_svg: "M12 2L2 22h20L12 2z" }
      - { label: "Custom B", color: "#34D399", icon_svg: "M12 2a10 10 0 100 20 10 10 0 000-20z" }
      - { label: "Custom C", color: "#7C3AED", icon_svg: "M3 3h18v18H3V3z" }
Activity Heatmap  ·  activity-heatmap.svg  ·  3 examples

Activity Heatmap

GitHub-style 7x52 contribution grid reimagined with neon glow + sequential cell stagger. 4 palettes (neon-green, neon-cyan, neon-rainbow, rose). Falls back to deterministic mock data when no real data is supplied.

Neon green (GitHub-classic with glow)

Activity Heatmap — Neon green (GitHub-classic with glow)

Familiar GitHub green but with a neon halo on bright cells. Mock data deterministically seeded by your name.

cards:
  heatmap:
    enabled: true
    palette: neon-green
Neon rainbow (jewel-tone)

Activity Heatmap — Neon rainbow (jewel-tone)

Cortex jewel-tone palette: purple → pink → gold sweep across intensities.

cards:
  heatmap:
    enabled: true
    palette: neon-rainbow
Rose palette, no glow

Activity Heatmap — Rose palette, no glow

Subtler look matching the brain widget's body palette. Glow off for accessibility / reduced-motion preference.

cards:
  heatmap:
    enabled: true
    palette: rose
    glow: false
3D Stat Cubes  ·  stat-cubes.svg  ·  2 examples

3D Stat Cubes

Isometric blocks displaying numeric stats. Each cube has 3 visible faces (top + front + side); top face shows the stat label, front face shows the value. Subtle orbit animation per cube.

GitHub-flavored stats

3D Stat Cubes — GitHub-flavored stats

Five cubes for the most common GitHub stats. Auto-colored from the cortex jewel-tone palette.

cards:
  cubes:
    enabled: true
    cubes:
      - { label: "PRs",     value: "1.2k" }
      - { label: "Commits", value: "8.4k" }
      - { label: "Stars",   value: "3.1k" }
      - { label: "Repos",   value: "47" }
      - { label: "Streak",  value: "112d" }
Skill stats, no orbit

3D Stat Cubes — Skill stats, no orbit

Show top languages with usage percent. Orbit off for stable composition.

cards:
  cubes:
    enabled: true
    orbit: false
    cubes:
      - { label: "Python",     value: "42%" }
      - { label: "TypeScript", value: "28%" }
      - { label: "Rust",       value: "18%" }
      - { label: "Go",         value: "12%" }
Code DNA Helix  ·  code-dna.svg  ·  2 examples

Code DNA Helix

Twin spiral strands with colored base-pair rungs labelled by your top languages. Sinusoidal strands gradient across the canvas, helix drifts horizontally for a 3D feel.

8 top languages, default palette

Code DNA Helix — 8 top languages, default palette

Eight languages encoded as colored rungs between the twin strands. Auto-colored from the cortex jewel-tone palette.

cards:
  dna:
    enabled: true
    title: "Code DNA"
    languages: ["Python","TypeScript","Rust","Go","React","SQL","Bash","Docker"]
Custom per-language colors

Code DNA Helix — Custom per-language colors

Override palette with explicit brand colors paired by index.

cards:
  dna:
    enabled: true
    languages: ["Python","Rust","TypeScript"]
    colors:    ["#3776AB","#CE422B","#3178C6"]
Skill Globe  ·  skill-globe.svg  ·  2 examples

Skill Globe

Stylized 2D globe (latitude/longitude grid with rotation) + named neon pins at user-supplied coordinates. Each pin has a pulsing ring + glowing dot + label.

Locations around the world

Skill Globe — Locations around the world

Pins at major tech hubs.

cards:
  globe:
    enabled: true
    title: "Where I work from"
    pins:
      - { label: "Berlin",        lon: 13.4,   lat: 52.5 }
      - { label: "Lisbon",        lon: -9.1,   lat: 38.7 }
      - { label: "London",        lon: -0.13,  lat: 51.5 }
      - { label: "New York",      lon: -74.0,  lat: 40.7 }
      - { label: "San Francisco", lon: -122.4, lat: 37.8 }
Globe without rotation

Skill Globe — Globe without rotation

Static for accessibility / reduced motion.

cards:
  globe:
    enabled: true
    rotate: false
    pins:
      - { label: "HQ",     lon: 0,    lat: 0 }
      - { label: "Remote", lon: 30,   lat: 30 }
Particle Cloud  ·  particle-cloud.svg  ·  1 example

Particle Cloud

Tag cloud of skills as particles orbiting a glowing core. Each particle drifts on its own elliptical orbit; weight controls font size and ring radius (heavier = closer + bigger).

Tech skill cloud

Particle Cloud — Tech skill cloud

12 skills with mixed weights, auto-colored.

cards:
  particles:
    enabled: true
    title: "Skill cloud"
    items:
      - { label: "Python",     weight: 2.6 }
      - { label: "Rust",       weight: 2.0 }
      - { label: "TypeScript", weight: 2.4 }
      - { label: "React",      weight: 1.8 }
      - { label: "AWS",        weight: 1.6 }
      - { label: "Docker",     weight: 1.4 }
      - { label: "Postgres",   weight: 1.4 }
      - { label: "Redis",      weight: 1.0 }
      - { label: "Kafka",      weight: 0.8 }
      - { label: "Three.js",   weight: 1.2 }
      - { label: "FastAPI",    weight: 1.6 }
      - { label: "Pydantic",   weight: 1.2 }
Now Playing  ·  now-playing.svg  ·  2 examples

Now Playing

Spotify-style 'currently coding in' card. Activity pill, language as track title, project as artist line, animated 32-bar waveform, progress bar with elapsed/duration.

Currently coding (default)

Now Playing — Currently coding (default)

Generic 'Coding · Python · MyProject' with mid progress.

cards:
  now_playing:
    enabled: true
    activity: "Coding"
    language: "Python"
    project:  "Cortex v0.4"
    progress: 0.62
    elapsed:  "1:24"
Debugging Rust

Now Playing — Debugging Rust

Different activity + language combo with custom accent color.

cards:
  now_playing:
    enabled: true
    activity: "Debugging"
    language: "Rust"
    project:  "tokio race condition"
    progress: 0.34
    elapsed:  "0:45"
    color:    "#CE422B"
Achievement Wall  ·  achievement-wall.svg  ·  2 examples

Achievement Wall

Bevelled trophy cabinet with hexagonal mounted trophies. Each trophy shows a glyph (emoji or letter), label, and date sub-label. Subtle scale-breathing per trophy.

Career milestones

Achievement Wall — Career milestones

Six trophies celebrating common dev milestones. Auto-colored from the jewel-tone palette.

cards:
  trophies:
    enabled: true
    title: "Achievements"
    columns: 4
    trophies:
      - { label: "First PR",       date: "2018",     glyph: "★" }
      - { label: "1k Commits",     date: "2020",     glyph: "🔥" }
      - { label: "OSS Maintainer", date: "2022",     glyph: "Ⓜ" }
      - { label: "AWS Certified",  date: "2023",     glyph: "☁" }
      - { label: "Speaker",        date: "2024",     glyph: "🎤" }
      - { label: "Cortex v1",      date: "2026-04",  glyph: "🧠" }
Compact 3-column layout

Achievement Wall — Compact 3-column layout

Same trophies but tighter — fits as an inline section rather than a hero block.

cards:
  trophies:
    enabled: true
    columns: 3
    trophies:
      - { label: "Founder",   glyph: "F" }
      - { label: "Shipper",   glyph: "S" }
      - { label: "Mentor",    glyph: "M" }
Yearly Timeline  ·  yearly-highlights.svg  ·  3 examples

Yearly Timeline

Horizontal career timeline — gradient connector, year markers with LIVE pulse on current year, tall cards with stats and bullets.

Auto-generated from start_year

Yearly Timeline — Auto-generated from start_year

Just specify when you started — Cortex generates placeholder cards for every year up to today. Replace as you fill them in.

cards:
  yearly_highlights:
    enabled: true
    start_year: 2022
    bullets_per_year: 3
    years: []
Fully custom years (recommended)

Yearly Timeline — Fully custom years (recommended)

Hand-curate each year's headline, bullets, and stats. Up to 6 years; oldest first.

cards:
  yearly_highlights:
    enabled: true
    years:
      - year: 2024
        label: "FOUNDATION"
        headline: "A Year of Shipping"
        bullets:
          - "Built foundations in Python + Vue."
          - "Earned first community stars."
        stats:
          - { num: "25+", label: "PROJECTS" }
          - { num: "52★", label: "PEAK STARS" }
      - year: 2025
        label: "GROWTH"
        headline: "Production & AI"
        bullets:
          - "Shipped LLM-powered features for clients."
          - "Open-sourced 3 internal tools."
        stats:
          - { num: "10+", label: "AI EXPERIMENTS" }
          - { num: "200+", label: "DEPLOYS" }
Tighter — start in 2024, 2 bullets per year

Yearly Timeline — Tighter — start in 2024, 2 bullets per year

Shorter cards for early-career profiles or when you want the timeline to feel tight rather than expansive.

cards:
  yearly_highlights:
    enabled: true
    start_year: 2024
    bullets_per_year: 2
    years: []
About Typing  ·  about-typing.svg  ·  3 examples

About Typing

Cycling terminal-style typing animation — 30+ rotating commands with jewel-tone cursor glow.

Generic only

About Typing — Generic only

Universal dev terminal commands ($ whoami, $ git status, etc.) — no personal references. Works for any profile.

typing:
  about:
    enabled: true
    lines: 8
    include: [generic]
Personal only

About Typing — Personal only

References your specific projects from current_focus + identity (your github_user, project names, etc.). More personal.

typing:
  about:
    enabled: true
    lines: 6
    include: [personal]
Both — recommended mix

About Typing — Both — recommended mix

Mix of universal + personal lines — best balance of relatability and personality.

typing:
  about:
    enabled: true
    lines: 10
    include: [generic, personal]
Motto Typing  ·  motto-typing.svg  ·  2 examples

Motto Typing

Philosophy quotes cycling — same engine as About but no cursor, longer hold time per line. Use for taglines/principles.

Default — 6 rotating mottos

Motto Typing — Default — 6 rotating mottos

Cortex ships 30+ curated dev-philosophy quotes; the typer cycles through 6 of them by default.

typing:
  motto:
    enabled: true
    lines: 6
Tight — 4 lines, faster cycle

Motto Typing — Tight — 4 lines, faster cycle

Fewer lines = each one shows for longer. Good when you want each motto to register fully before rotating.

typing:
  motto:
    enabled: true
    lines: 4
GitHub Icon  ·  github-icon.svg  ·  1 example

GitHub Icon

Pulsing octocat disc with jewel-tone violet halo + soft Gaussian-blur glow — drop-in 96x96 profile icon.

Default (no config required)

GitHub Icon — Default (no config required)

Renders automatically from identity.github_user — no widget-level config exists. Halo color is the jewel-tone violet that ties to the rest of the composition.

identity:
  github_user: "your-handle"  # the icon picks up your handle automatically
Animated Divider  ·  animated-divider.svg  ·  1 example

Animated Divider

Three layered sine waves drifting in counterpoint at different speeds (9s/11s/14s) — used between sections.

Default (no config required)

Animated Divider — Default (no config required)

Always-on, no widget-level config — the divider matches the jewel-tone palette of header/footer/brain. Drop the SVG anywhere in your README.

# Place the rendered SVG anywhere in your README:
# ![](https://raw.githubusercontent.com/<user>/<user>/main/assets/animated-divider.svg)
Footer Banner  ·  footer-banner.svg  ·  3 examples

Footer Banner

Inverted wave-shape footer mirroring the header — title, subtitle, drifting jewel-tone gradient. Capsule-render replacement.

Wave shape, drifting (default)

Footer Banner — Wave shape, drifting (default)

Sine-wave top edge with the same drift animation as the header — symmetric bookends.

cards:
  footer:
    enabled: true
    shape: wave
    title: "@your-handle"
    subtitle: "Built with Cortex"
    height: 180
    animation: drift
Slice shape, static

Footer Banner — Slice shape, static

Diagonal top edge, no animation — minimal footer for understated profiles.

cards:
  footer:
    enabled: true
    shape: slice
    title: "@your-handle"
    height: 140
    animation: static
Rect shape with custom palette

Footer Banner — Rect shape with custom palette

Flat rectangular footer with your own brand colors — e.g., warm sunset gradient.

cards:
  footer:
    enabled: true
    shape: rect
    title: "@your-handle"
    height: 120
    animation: drift
    colors: ["#1A0612", "#7C2D12", "#EA580C", "#FBBF24", "#1A0612"]

All widgets render to pure SVG with SMIL + CSS animations — no JS, no build step, no external CDN dependency. Schema is validated at build time; mismatched configs fail loudly with field-specific error messages.


📺 Profile gallery

Tier Profile Live 3D
Reference (Extreme) @AbdullahBakir97 3D Brain →
Standard your profile here — submit a showcase issue coming soon
Minimal your profile here coming soon

Want a faster setup? Pick a template archetype — Backend Engineer, Frontend Specialist, Data Scientist, Student, etc.


⚡ Installation (30 seconds)

Step 1 — drop this workflow into your profile repo

# .github/workflows/cortex.yml
name: Cortex Profile
on:
  schedule: [{cron: "0 6 * * *"}]
  workflow_dispatch:

permissions:
  contents: write
  pages: write
  id-token: write

jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: AbdullahBakir97/cortex@v1
        with:
          config: .github/cortex.yml
          github_token: ${{ secrets.GITHUB_TOKEN }}

Step 2 — write a config

# .github/cortex.yml
identity:
  name: "Your Name"
  github_user: "yourhandle"
  tagline: "What you do, in one line"

brand:
  palette: "neon-rainbow"

brain:
  enabled: true
  three_d: { enabled: true }

cards:
  tech_stack: { enabled: true }
  yearly_highlights: { enabled: true }
  current_focus: { enabled: true }

typing:
  header: { languages: [en], lines_per_language: 10 }
  about:  { lines: 30 }
  motto:  { lines: 30 }

auto_update:
  markers: { activity: true, latest_releases: true, quote_of_the_day: true }

Step 3 — trigger once manually

GitHub → Actions tab → Cortex Profile → Run workflow.

That's it. Wait ~2 minutes for the first build. Reload your profile. 🧠

Want config autocomplete in VS Code? Add # yaml-language-server: $schema=https://cortex.dev/schema/v1.json at the top of your cortex.yml.


🎯 What you get

  • assets/brain-anatomical.svg — the centerpiece neon brain, ~200 anatomical paths
  • assets/tech-cards.svg — 6 glassmorphism skill cards with stats + animated proficiency bars
  • assets/yearly-highlights.svg — career timeline with year markers + LIVE pulse on current year
  • assets/current-focus.svg — Netflix-tile dashboard for active projects
  • assets/about-typing.svg + motto-typing.svg — 30-50 cycling lines each, multi-color
  • docs/index.html — interactive 3D brain viewer (auto-deployed to GitHub Pages)
  • README.md markers — auto-rewritten daily with: recent activity, latest releases, quote of the day, gitGraph, PageSpeed, WakaTime, more

🚀 Roadmap

  • v1.0 — GitHub Action with 5 core widgets (current state of @AbdullahBakir97)
  • v1.1 — Brain Heatmap (lobes glow by real GH activity per region)
  • v1.2 — Skill DNA Strand visualization
  • v1.3 — Project Trading Cards (Pokemon-style holographic SVGs)
  • v1.4 — Time-lapse brain (years 2018 → today rendered as animation)
  • v2.0 — Web dashboard (no-YAML config UI) at app.cortex.dev
  • v2.1 — AI Portrait generator
  • v2.2 — Digital Twin chatbot (visitors ask "what does X work on?")
  • v3.0 — Cortex Pro (custom domain for 3D viewer, advanced AI features)

Vote on what we should ship next via GitHub Discussions.


🌟 Showcase

Built something cool with Cortex? Open a Showcase issue — we feature one new profile in the README every Friday.


⚖️ License & attribution


Tweet about Cortex   Vote on Product Hunt   Show HN

Made with 🧠 by @AbdullahBakir97 · Discussions · Issues

Build your brain

About

Anatomically-accurate neon brain skill atlas for your GitHub profile README. Turns 30 lines of YAML into 10 animated SVG widgets that pulse with your real activity. Pure SVG + SMIL, no JS, no build step.

Topics

Resources

License

Stars

Watchers

Forks

Packages

 
 
 

Contributors

Languages