Split Project Card
A full-width horizontal card featuring one project with a Placeholder on the left and the name, description, discipline tags, and a case study link on the right.
A full-width horizontal card featuring one project with a Placeholder on the left and the name, description, discipline tags, and a case study link on the right.
Search blocks by description or jump to a page.
The source for every Portfolio block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Split Project Card features a single project, Ledger, across a full-width two-column card: a Placeholder at aspect-4/3 on the left and the project details on the right. The details column carries the role and year as a meta line, a heading-sized project name, a paragraph description that names the real constraint (14 clicks cut to 3), a row of discipline tags (Product design, Fintech, Dashboard, Research), and a View case study link with an ArrowUpRight icon.
The component uses a single project object rather than an array. The full-paragraph description and the tag row together are the distinctive combination: the paragraph names the problem, the tags say what disciplines were used to solve it.
Reach for this block to feature one highlighted project on a homepage or at the top of a /work page. The installer swaps the Placeholder for a real screenshot, rewrites the description around their actual project constraint, and updates the tags to reflect their stack.
A natural flow around it on a Portfolio Pro page:
Before
After
One strong use is the flagship-project feature on a homepage. Other uses:
Tip: the description earns its length only when it names the specific problem and the specific fix; a generic overview should be cut to two sentences.