Compare Features LandingLanding page, 1 page
Flowline SaaS LandingLanding page, 1 page
Prismo Creative AgencyCreative, 1 page
Velour Car DetailingLanding page, 1 pageDot Matrix Estimate Card
Plain editable Etch tree (eyebrow, h2, intro) holding a receipt-styled "Estimate Card": a document header (doc title, doc subtitle, date, reference number — all plain text), a dashed rule, a circular dot-matrix gauge tha…
50 sites for €79 only, Compare all plans
All photos and visual assets used in this preview are sourced from Unsplash.
The system behind it
One pattern, your whole brand.
Dot Matrix Estimate Card reads your ACSS tokens, so changing a color, a font or a spacing value once restyles it everywhere. No hard-coded values, nothing to override.
- Type
- Component
- Category
- Pricing cards
- Responsive
- Desktop to phone
- Works with
- Etch, ACSS, plain CSS
Options 4
Set on the section, in Etch’s attributes panel. No code needed.
data-modesingle = one line at a time (radio group, like a plan picker), multi = any combination (checkboxes, like an add-on cart)
data-currencysymbol or code prepended/appended to prices
data-dotsshows or hides the circular dot-matrix budget gauge
data-maxexplicit ceiling for the gauge percentage; defaults to the sum of every line
Component props 1
Only the repeating unit is a component. Duplicate, reorder or delete it in Layers and edit these props.
labelRESEARCH_SPRINT
price750
defaultOnTrue
Free pattern. Yours to use on any site, no plan needed.
Included in Pro From €39 a year, with all 753 patterns.
Get ProMore patterns
