About this block

Skills Matrix lays skills against three engagement columns in a bordered, horizontally scrollable table. The header row names the modes (I lead it end to end, I build alongside a team, I bring in a specialist) and each skill row carries exactly one filled dot under the mode that fits, with smaller muted dots in the other two cells. The heading and lede frame it as one mark per row, more useful than a score out of ten.

Columns and rows are two typed arrays, and each row renders a filled dot only where its mode matches the column key. The single mark rule is the honest constraint: it forces a clear stance on every skill instead of a hedge.

When to use

Reach for this block on a skills or services page when the installer wants to show scope honestly, naming what they own versus what they hand off. The installer swaps the skill rows and their mode, keeping one mark per row so the grid stays legible.

A natural flow around it on a Portfolio Pro page:

Before

• About section
• Skills timeline

After

• Services list
• Contact section

What you can display

One strong use is the lead, build, or refer scope grid. Other configurations:

• Team coverage. Columns for in-house, contract, and partner delivery across each capability.
• Availability grid. Columns for taking on, collaborating, or referring, for a freelancer setting expectations.
• Service tiers. Columns for full service, advisory, or referral across a studio menu.

Tip: resist adding a fourth column; the value is in forcing one clear stance per row, which a wider grid quietly undoes.