Grouped Tool Grid
Three labeled columns of tool tiles covering Design, Development, and Collaboration, each tile showing a two-letter mark and the tool name.
Three labeled columns of tool tiles covering Design, Development, and Collaboration, each tile showing a two-letter mark and the tool name.
The Portfolio Collection unlocks the source for every Portfolio block. All Access unlocks every Collection.
Already purchased? Log in
Grouped Tool Grid organises eighteen tools into three labeled columns, Design, Development, and Collaboration, each a set of tile cards with a two-letter mark and the tool name. The heading lands the rationale, tools grouped by what they do in the work, not by how popular they are, and the lede commits to the standard, every one earns its place on a live project.
Tools live in a typed groups array, each group holding a label and a tools sub-array of name and mark. The two-letter mark is the distinctive detail: no brand SVGs to maintain, no public assets, just a legible token that reads instantly in a small tile.
Reach for this block on a skills or about page where the installer wants to show the full stack without a long bullet list. The installer swaps tools and marks to match their own live setup, keeping each group to roughly six items.
A natural flow around it on a Portfolio Pro page:
Before
After
One strong use is the full design-to-deploy toolkit. Other groupings:
Tip: three groups at six tools each is the readable ceiling; more than that and the section reads as a brag sheet rather than a working inventory.