Harbor SaaS Suite
+6Hairline Grid Portfoliov1.0.0
Use this Skill to build website page.
5.09 downloads0 likes0 saves
$4.99
What do I get when I buy this Skill?Create a personal portfolio with a precise monochrome grid, profile sections, selected work, and light and dark viewing modes. It gives designers and technical professionals a distinctive but readable way to present their experience, projects, writing, and contact details.
Picked most often by
Updated Aug 31, 2026
Similar Skills
View all skills
What you get
- A complete personal portfolio page in the hairline-grid style: profile header, overview, social links, activity heatmap, about, stack, experience, and projects
- Light and dark themes with a working toggle, both fully designed — not an afterthought inversion
- A single self-contained HTML file you can host anywhere, or the same design generated natively in your React/Vue/Svelte/Astro project
- Crisp inline-SVG icons throughout and your portrait embedded as a compact WebP — no external requests, no icon fonts
- A design-language reference and a validator script so later edits stay on-system
Good fit
- Developers and design engineers who want a portfolio that looks precise and understated, not template-flashy
- Job seekers who need a fast personal site that reads well in both themes and on mobile
- Anyone who admires the technical-drawing aesthetic: hairline rules, monospace captions, monochrome restraint
Not for
- Colorful, image-heavy, or animation-heavy personal brands — this system is deliberately monochrome and calm
- Multi-page sites with blogs and CMS workflows — the skill produces a single-page portfolio (your stack can grow it later)
- Pixel-for-pixel cloning of any existing person's site — output identity is always yours or fictional
Brand IdentityDigital Publications & Web PagesBuild Website PageBuild Portfolio SiteEditable OutputGuided WorkflowVisually PolishedMinimalistMonochromeHairline GridTechnical Blueprint
About this Skill
Turn your name, work history, and a handful of links into a portfolio that looks drafted on an engineer's drawing board — hairline rules running edge to edge, a calm monochrome palette, and your face and projects sitting exactly on the grid.
What you get
- A complete one-page portfolio: profile header with a flipping role line, overview with your location and contacts, social buttons, a contribution heatmap, about, stack, experience, and project cards
- Light and dark themes with a working toggle — both designed properly, and the page follows your system preference
- One self-contained HTML file you can put on any host, or the same design built natively inside your React, Vue, Svelte, or Astro project
- Your photo embedded right in the page, every icon drawn as crisp SVG — nothing loads from anywhere else
How to use it
- Tell it who you are: name, a couple of role lines, and which sections you want
- Paste in your work history, projects, and links — or let it fill everything with placeholder content you can swap later
- Say whether you want a standalone file or code inside your existing project
- Open the result, flip the theme toggle, and replace anything you like — it is plain readable code
No API key needed; the page is generated entirely by your coding agent.
What you need before you start
- You bring
- Display name, role lines, and the section content you want (about, experience, projects, contacts) · Optional portrait/avatar image
- Last tested
- v1.0.0 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
User reviews
Loading reviews…