The problem is real: a description and a list of seven currently sit at the same size, in the same column, with an 8px gap between them. Nothing tells the eye where prose stops and inventory starts, so an open panel reads as one grey block.
Every board below shows two panels, and the second one is the test. Panel one holds short noun phrases ("Vendor agreements"). Panel four holds full sentences ("No more waiting until a small concern becomes an expensive problem."). Several of the obvious treatments work beautifully on the first and fall apart on the second, and since that copy is AISV's and not ours to shorten, a treatment that only works on labels is not a treatment we can use.
nowWhat is there nowThe items are a plain column at the same size as the description above them. Nothing but a small gap separates a sentence from a list of seven, so the eye reads the whole panel as one grey block.
Contracts and Commercial Agreements
Get help reviewing, negotiating, and creating agreements that protect your business and support your goals.
Client contractsVendor agreementsPartnership agreementsLicensing agreementsService agreementsTerms and conditionsPayment and cancellation terms
Ongoing Strategic Legal Guidance
Have an experienced legal team available to answer questions, review decisions, and help you plan ahead.
No more wondering whom to call.No more avoiding a legal question because you are worried about the bill.No more waiting until a small concern becomes an expensive problem.
1Bullets, two columnsA disc marker and a second column. The marker says "list" instantly, and the column halves the height of a seven-item panel, so the accordion stops feeling like a wall when it opens. Watch the second panel. Its items are full sentences, not labels, so they wrap and the two columns stop lining up. Any treatment chosen here has to survive both kinds of content.
Contracts and Commercial Agreements
Get help reviewing, negotiating, and creating agreements that protect your business and support your goals.
Client contractsVendor agreementsPartnership agreementsLicensing agreementsService agreementsTerms and conditionsPayment and cancellation terms
Ongoing Strategic Legal Guidance
Have an experienced legal team available to answer questions, review decisions, and help you plan ahead.
No more wondering whom to call.No more avoiding a legal question because you are worried about the bill.No more waiting until a small concern becomes an expensive problem.
2Tick iconsA check before each item. It does more than mark a list: a tick reads as included, which is the right claim for a menu of services. The mark is BUSINESS teal so it separates from the NIGHT headings without introducing a new colour. The cost is that seven ticks in a column is a lot of repeated shape, and on the sentence panel a tick in front of "No more wondering whom to call" reads slightly oddly, as though the absence were a feature being ticked off.
Contracts and Commercial Agreements
Get help reviewing, negotiating, and creating agreements that protect your business and support your goals.
Client contractsVendor agreementsPartnership agreementsLicensing agreementsService agreementsTerms and conditionsPayment and cancellation terms
Ongoing Strategic Legal Guidance
Have an experienced legal team available to answer questions, review decisions, and help you plan ahead.
No more wondering whom to call.No more avoiding a legal question because you are worried about the bill.No more waiting until a small concern becomes an expensive problem.
3Typography only, no markersNo bullet, no icon. The items go smaller, letterspaced and NIGHT, so they read as labels rather than prose. The quietest option and the most in keeping with an "elevated, simplified" brief, because it adds no new furniture to the page. It also fails hardest on the sentence panel: setting a full sentence in letterspaced caps is unreadable past about six words.
Contracts and Commercial Agreements
Get help reviewing, negotiating, and creating agreements that protect your business and support your goals.
Client contractsVendor agreementsPartnership agreementsLicensing agreementsService agreementsTerms and conditionsPayment and cancellation terms
Ongoing Strategic Legal Guidance
Have an experienced legal team available to answer questions, review decisions, and help you plan ahead.
No more wondering whom to call.No more avoiding a legal question because you are worried about the bill.No more waiting until a small concern becomes an expensive problem.
4Hairline rowsEach item sits on its own row with a hairline above it, like a specification table. The strongest separation of the five: nobody could mistake this for a paragraph. It is also the heaviest. Four open panels of this would put roughly twenty more rules on the page, and the section already uses hairlines to separate the accordions themselves.
Contracts and Commercial Agreements
Get help reviewing, negotiating, and creating agreements that protect your business and support your goals.
Client contractsVendor agreementsPartnership agreementsLicensing agreementsService agreementsTerms and conditionsPayment and cancellation terms
Ongoing Strategic Legal Guidance
Have an experienced legal team available to answer questions, review decisions, and help you plan ahead.
No more wondering whom to call.No more avoiding a legal question because you are worried about the bill.No more waiting until a small concern becomes an expensive problem.
5Tinted tagsEach item becomes a chip on a FREEDOM tint. The furthest from prose of any option, and it makes the list scannable as a set of things rather than a sequence of lines. The second panel is where it strains. At this width the sentences still fit on one line each, so nothing wraps, but a chip implies a short label and a sentence-length chip reads as a highlighted sentence rather than a tag. On a narrower column it would wrap, and a wrapped chip is a paragraph with a background.
Contracts and Commercial Agreements
Get help reviewing, negotiating, and creating agreements that protect your business and support your goals.
Client contractsVendor agreementsPartnership agreementsLicensing agreementsService agreementsTerms and conditionsPayment and cancellation terms
Ongoing Strategic Legal Guidance
Have an experienced legal team available to answer questions, review decisions, and help you plan ahead.
No more wondering whom to call.No more avoiding a legal question because you are worried about the bill.No more waiting until a small concern becomes an expensive problem.
Dotted rows
Five ways to draw the same row separator. The reason to prefer a dot over the solid hairline is not decoration: the section already uses solid hairlines to divide the accordions from each other, so using them again inside a panel makes two different jobs look identical. A dotted rule is quieter and unmistakably subordinate.
Panel four is on every board again, because a dot leader in particular depends on the items being shorter than the column.
1Dotted rule above each rowThe hairline version with border-top switched from solid to dotted. One character of CSS, and the row still separates cleanly while the rule stops competing with the solid hairlines that divide the accordions themselves. That is the real gain: two different jobs now look different. The browser draws these dots as small squares at a fixed pitch, which is dense and slightly mechanical at this size.
Contracts and Commercial Agreements
Get help reviewing, negotiating, and creating agreements that protect your business and support your goals.
Client contractsVendor agreementsPartnership agreementsLicensing agreementsService agreementsTerms and conditionsPayment and cancellation terms
Ongoing Strategic Legal Guidance
Have an experienced legal team available to answer questions, review decisions, and help you plan ahead.
No more wondering whom to call.No more avoiding a legal question because you are worried about the bill.No more waiting until a small concern becomes an expensive problem.
2Round dots, wider pitchThe same idea drawn properly: real round dots on a 7px pitch instead of the browser default, using a repeating radial gradient. Lighter than d1 and noticeably more deliberate, because the spacing is a choice rather than whatever the rendering engine does. My pick of the five. It reads as a list at a glance and adds almost no visual weight.
Contracts and Commercial Agreements
Get help reviewing, negotiating, and creating agreements that protect your business and support your goals.
Client contractsVendor agreementsPartnership agreementsLicensing agreementsService agreementsTerms and conditionsPayment and cancellation terms
Ongoing Strategic Legal Guidance
Have an experienced legal team available to answer questions, review decisions, and help you plan ahead.
No more wondering whom to call.No more avoiding a legal question because you are worried about the bill.No more waiting until a small concern becomes an expensive problem.
3Dot leader, running to the rightThe typographic version: the item sits left and a run of dots carries the eye to the right edge, the way a contents page or a menu sets a price list. Nothing could be mistaken for a paragraph here, because prose never does this. It suits panel one, where the items are short labels of uneven length. On panel four the sentences nearly fill the column, so the leader shrinks to a stub and the device stops reading.
Contracts and Commercial Agreements
Get help reviewing, negotiating, and creating agreements that protect your business and support your goals.
Client contractsVendor agreementsPartnership agreementsLicensing agreementsService agreementsTerms and conditionsPayment and cancellation terms
Ongoing Strategic Legal Guidance
Have an experienced legal team available to answer questions, review decisions, and help you plan ahead.
No more wondering whom to call.No more avoiding a legal question because you are worried about the bill.No more waiting until a small concern becomes an expensive problem.
4Dot leader with a tick at the endThe leader carries the eye somewhere rather than trailing off: a tick sits at the right edge of every row. It combines the two things that worked separately, the dots that say list and the tick that says included. The ticks line up in a column at the right margin, which is tidy on labels and slightly odd on sentences, where the tick lands a long way from the words it belongs to.
Contracts and Commercial Agreements
Get help reviewing, negotiating, and creating agreements that protect your business and support your goals.
Client contractsVendor agreementsPartnership agreementsLicensing agreementsService agreementsTerms and conditionsPayment and cancellation terms
Ongoing Strategic Legal Guidance
Have an experienced legal team available to answer questions, review decisions, and help you plan ahead.
No more wondering whom to call.No more avoiding a legal question because you are worried about the bill.No more waiting until a small concern becomes an expensive problem.
5Dashed, for comparisonDashes rather than dots, at the same weight. Included because the two are easy to conflate when specifying and they behave differently: a dash has direction and reads as a broken line, where a dot has none and reads as a texture. A dash suggests something interrupted; a dot simply spaces. For a list of services, the dot is the more neutral mark.
Contracts and Commercial Agreements
Get help reviewing, negotiating, and creating agreements that protect your business and support your goals.
Client contractsVendor agreementsPartnership agreementsLicensing agreementsService agreementsTerms and conditionsPayment and cancellation terms
Ongoing Strategic Legal Guidance
Have an experienced legal team available to answer questions, review decisions, and help you plan ahead.
No more wondering whom to call.No more avoiding a legal question because you are worried about the bill.No more waiting until a small concern becomes an expensive problem.