skills.rest
AshesOfTheUndead
AshesOfTheUndeadCOMMUNITY
Explore all skills by this author →
GitHub

portfolio-detail

Generate a single-file responsive HTML portfolio with hover-reveal thumbnails and Alimama DaoLiTi typography.

Updated Jul 9, 2026
Search Tags:#typography#html#portfolio#web-design#studio#atelier
One-click install
npx skills add https://github.com/AshesOfTheUndead/rezurxlib --skill portfolio-detail
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: portfolio-detail
Source: https://github.com/AshesOfTheUndead/rezurxlib/tree/main/skills/design/design-templates/portfolio-detail
Command: npx skills add https://github.com/AshesOfTheUndead/rezurxlib --skill portfolio-detail

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill solves the challenge of creating a sophisticated, minimalist portfolio website that reflects the restrained, artisanal aesthetic required for design studios, font foundries, and craft-based workshops.

Core Features & Use Cases

  • Atelier-Style Interaction: Features a horizontal-row list with hover-reveal thumbnail interactions and a hash-routed detail page system.
  • Artistic Typography: Integrates the Alimama DaoLiTi (刀隶体) font via CDN for a distinct, high-end Chinese aesthetic.
  • Dual-Mode Operation: Supports both local file generation (via Claude Code) and direct HTML output for online chat environments.
  • Use Case: Ideal for designers, calligraphers, or craft studios needing a "white-space" heavy, museum-quality digital presence that emphasizes content over clutter.

Quick Start

Use the portfolio-detail skill to generate a new studio website for a calligraphy workshop named MoJi, featuring three projects titled 'Ink Study', 'Paper Craft', and 'Brush Flow'.

Frequently Asked Questions about portfolio-detail

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate a horizontal portfolio website with hover-reveal thumbnails?▼

To generate a horizontal portfolio website with hover-reveal thumbnails, provide your studio branding and project details via a structured JSON data schema, and the tool outputs a single-file, responsive HTML page with the requested interactive list.

Can I use Alimama DaoLi Ti typography for my web design studio portfolio?▼

Yes, you can use Alimama DaoLi Ti typography for your web design studio portfolio. The generated HTML integrates the DaoLi Ti font via CDN automatically, ensuring a distinct, high-end Chinese aesthetic without manual font configuration.

How do I output HTML portfolio files locally versus in an online chat?▼

To output HTML portfolio files locally or in an online chat, the tool adapts to its execution environment by either writing a physical file to the local file system or returning an inline HTML code block for direct online rendering.

Does this portfolio generator support dynamic content injection for multiple projects?▼

Yes, this portfolio generator supports dynamic content injection for multiple projects. It uses a structured JSON data schema to populate studio branding, project details, and gallery layouts directly into the horizontal-row list and detail pages.

What is the best way to create an atelier-style minimalist portfolio for a calligraphy workshop?▼

The best way to create an atelier-style minimalist portfolio for a calligraphy workshop is to use a white-space heavy, museum-quality HTML template with hash-routed detail pages and DaoLi Ti typography to emphasize content over clutter.

Are there limitations when using a single-file HTML structure for a portfolio website?▼

A limitation of using a single-file HTML structure for a portfolio website is that all CSS, JavaScript, and data are embedded in one document, which can increase initial load times for large galleries but ensures easy portability.

Related Skills

Explore More Design & Creative Skills→
deichworxdeichworx

pptx

Convert HTML templates into PowerPoint slides with Python tooling.

Community
Advanced
TencentCloudBaseTencentCloudBase
72

web-development

Structure and deploy web frontend projects with CloudBase Web SDK integration.

Official
Intermediate
MyHeavenDyfMyHeavenDyf

open-design-landing

Generate an Atelier Zero editorial landing page with brand details and AI-generated images.

Community
Advanced
The-Skyy-Rose-Collection-LLCThe-Skyy-Rose-Collection-LLC
3

Static Web Development

Build accessible, responsive static websites with semantic HTML and CSS.

Official
Intermediate