Published skills
Showing 48 of 75
frame-liquid-bg-hero
WebGL fluid displacement background with overlaid golden phrases at the top, suitable for video intros, landing page hero sections, or posters.
frame-logo-outro
Logo entrance with block assembly, a glowing bloom effect, and tagline reveal, suitable for video outros or brand closings.
frame-macos-notification
Realistic macOS notification banner with app icon, title, and body text, perfect for video overlays or product launch previews.
deck-guizang-editorial
E-magazine with E-ink; featuring 10 layouts and 5 color palettes: Ink, Indigo Porcelain, Forest Ink, Kraft Paper, and Dune.
data-report
Converts CSV/Excel/JSON data into beautiful visual report pages.
deck-graphify-dark
A design featuring a deep night gradient, floating orbs, an SVG force-directed graph, and the JetBrains Mono font.
article-magazine
Premium long-form article layout in the style of Substack/Medium, perfect for publishing on blogs and official accounts.
deck-hermes-cyber
A visual theme featuring a black background, CRT grid scanlines, a $ command line title, large mint green text, and a three-tier tag.
deck-open-slide-canvas
Features a fixed 1920x1080 canvas, allowing for free combination of React components without being tied to templates.
dashboard
Fixed sidebar and top bar, KPI grid, and 1-2 charts.
deck-dir-key-nav
8-page monochrome background, 160px display, 4px accent, and a mono arrow list.
deck-presenter-mode
Tokyo Night is the default theme. Press T to switch between 5 themes, and S to open the teleprompter popup.
card-xiaohongshu
Xiaohongshu-style knowledge cards, arranged in multiple rows for swipeable browsing.
deck-pitch
A 10-page funding deck featuring a white background, blue-purple gradient hero, traction displayed as a bar chart, and an $X.XM funding ask.
deck-tech-sharing
GitHub-dark style, JetBrains Mono font, and terminal code blocks, including an agenda and Q&A.
card-twitter
Twitter quotes and data cards, suitable for tweets.
deck-blueprint
Cream paper, rust red, blueprint grid mask, black-edged hard card, and pipeline box.
deck-swiss-international
A 16-column grid with a single saturated accent color, available in 22 fixed layouts using Klein Blue, Lemon, Mint, or Safety Orange.
blog-post
Magazine-style long-form article, featuring a masthead, hero section, figures, pull quote, and author's byline.
dating-web
Consumption Sentiment Matching Dashboard: Signal ticker, KPIs, 30-day bar chart, and trends.
deck-simple
A generic horizontal-swipe HTML deck, without a magazine aesthetic.
deck-xhs-pastel
A design featuring a cream base, soft glow blob, macaron-style rounded card, and Playfair italic numbering.
meeting-notes
Title, attendance, agenda, resolutions, action items, and next meeting.
doc-kami-parchment
Warm parchment background (#f5f4ed) with an ink blue accent (#1B365D), featuring a single serif font and editorial-grade typography.
docs-page
Three-column document page with side navigation, main content, and a right-aligned Table of Contents.
eng-runbook
Service overview, covering alerts, dashboards, operational commands, on-call, and incident lists.
finance-report
Presents a masthead, KPIs, revenue/burn rate charts, P&L statements, key highlights, and an outlook.
frame-data-chart-nyt
NYT newsroom layout, staggered reveal animations, and editorial-grade charts (line, bar, range band).
frame-flowchart-sticky
SVG curve connections, sticky note nodes, and cursor interaction, for whiteboard-style brainstorming sessions.
frame-glitch-title
Digital glitch / astigmatism shift / data corruption title, suitable for video transitions / cyberpunk hero.
hr-onboarding
First week schedule, buddy, learning path, equipment, and completion standards.
kanban-board
A board featuring four columns (To do, In progress, In review, Done), cards, avatars, and swimlanes.
live-dashboard
Notion-style team dashboard, including KPIs, a 7-day sparkline, an activity feed, and a task table.
motion-frames
A set of loopable CSS animations including a rotating ring, a globe, a timer, and parallax tags.
poster-hero
Vertical posters and social media sharing images with strong visual impact.
pricing-page
Three-tier pricing, feature comparison table, and FAQ.
prototype-web
Clickable, functional web prototype with navigation, hero section, features section, and CTA.
resume-modern
Modern minimalist resume, A4 single page, suitable for printing or exporting as PDF.
social-media-dashboard
Focuses on platform switching, fan and engagement KPIs, growth curves, top posts, and trending topics.
social-reddit-card
Realistic Reddit post card with up/down votes and comment count, suitable for video overlays or story sharing.
social-spotify-card
Spotify Now Playing style card: album cover, progress bar, and playback controls, adapted for video overlays or personal homepages.
social-x-post-card
Realistic X (Twitter) tweet card featuring interaction data (likes/reposts/views), designed for video overlays or image card sharing.
team-okrs
Quarterly banner, 3 objectives, KR progress bar, owner, and status pill.
vfx-text-cursor
Cursor light trail, colorful radiating lines, and a directional light spot, ideal for video intros revealing golden phrases word by word.
waitlist-page
A minimalist pre-release product landing page featuring email capture, a logo, and decorative layers.
web-proto-editorial
Editorial-minimalist: Warm monochrome canvas, with serif display and grotesque body typefaces.
weekly-update
6-8 page horizontal sliding weekly report: Published / In progress / Blocked / Metrics / Help needed.
wireframe-sketch
Grid background, marker strokes, multiple tabs, sticky notes, and scribble charts.
Category alert