Design system 1.0
Growth Ring

A tree keeps its own record. So does every consignment.

Each case is drawn as a timber cross-section. A ring is laid down for every stage the law asks for, as wide as the time it took, and scarred where something went wrong. Compliance stops being a table and becomes something you can read at a glance, the way a forester reads a stump.

The mark

Family tie

Hikari means light. The four dots of the Hikari Solutions mark sit at the pith of ours: the light at the centre, the record growing around it. They appear in the logo and nowhere else.

What we walked away from

Every product in this category shows a forest from a drone, a green button and a leaf. We use no forest green, no leaf, no map with arcs. The identity comes from the timber trade's own evidence: the ring record, the marking crayon, the sounded log.

The room it is built for: a compliance lead at a furniture importer in Dandenong South, 10 am, a daylight office above the warehouse floor, a container booked to sail in nine days. Light, calm, readable from a metre away.

Colour

Restrained, with one highlighter. Petrol carries the brand, the chartreuse mark carries attention. Every ratio below is measured in the page, not estimated.

Ground and ink

    Brand

      Status, states only

        Ring ramp, for charts

          Family, logo only

            Status vocabulary

            The law has two conclusions: low risk and not low risk. A person reaches them. Everything else is a stage or a reading. Every pill pairs its colour with a shape, so it reads in greyscale and for colour-blind users.

            Whose mark is it

            Anything the assistant drafted carries a dashed edge until a named person confirms it. A solid edge always means a person decided.

            Typography

            Young Serif for what matters, sturdy and warm. Hanken Grotesk for everything you work with, with tabular figures so numbers line up. Vietnamese, Indonesian and Latin-extended glyphs are included for supplier names.

            Display
            Young Serif, fluid

            Know your timber is legal before it sails.

            Heading 1
            fluid

            Nine rings. One for every stage the law asks for.

            Heading 2
            fluid

            Invoiced volume 46.2 m³ exceeds the harvest permit.

            Lead
            Hanken Grotesk 400

            Eco Auditors runs your due diligence under the Illegal Logging Prohibition Act, stage by stage, and a named reviewer signs every conclusion.

            Body 16 / 1.55

            Tân Phú Timber Export JSC supplied species, harvest area and chain of custody for Acacia mangium from Quảng Trị. PT Jati Lestari Nusantara has been asked for a corrected harvest permit.

            UI heading 650

            Supplier evidence overdue 3 days

            Small 14, muted

            Due diligence projected 01/10/2026. Sails 08/10/2026.

            Tabular figures
            Invoiced volume46.2 m³
            Harvest permit volume38.0 m³
            Consignments this contract year212 of 400
            Monthly fee, Tier 3$4,850.00

            Shape, space and depth

            Soft Instrument. Circles carry data, rectangles carry text and controls. One hairline tinted to the brand hue. Depth comes from tone: white surfaces on a toned page. A shadow appears only on things that float.

            --r-ctl 8 px, controls
            --r-card 14 px, cards
            --r-lg 22 px, frames
            circle, data
            --elev-pop, floating only
              Control height
              44 px
              Row height
              52 px
              Card padding
              24 px
              Border
              1 px, 1.5 px on dashed drop zones
              Dividers
              Hairline between rows, nothing between columns
              Navigation
              Icon rail, 72 px

              Controls

              Every control is 44 px tall or has a 44 px hit area. Focus is always visible. Try the keyboard.

              Buttons

              Fields

              As printed on the permit.
              Matched to the FSC database at 09:02.
              Exceeds the harvest permit volume of 38.0 m³. Check the invoice or upload the second permit.
              Read from page 2 of the invoice. Confirm or correct it.

              Choices

              Evidence upload

                Surfaces and data

                Cards are used when something is an object you can pick up. Lists and tables are not boxed. Wide tables scroll inside themselves.

                Table, DDS Register

                Tabs and accordion

                Twelve documents, two awaiting translation sign-off.

                Why do you need the harvest permit?
                The law asks where the timber was cut and whether it was legal to cut it there. The permit is the evidence for both.
                Can I answer in Bahasa Indonesia?
                Yes. Documents are kept in the original language and a translation is stored beside them.

                Navigation, icon rail

                Tuesday 29/09/2026

                Morning, Dana.

                DWDana Whitlock

                The rail holds seven destinations at most. Labels appear on hover and focus. On a phone it becomes a bottom bar.

                Layers

                Made for this product

                The components no other product has. This is where the system stops being a style and becomes Eco Auditors.

                The section, read ring by ring

                • Stage done
                • Growing now
                • Still to come
                • Scar, an anomaly

                Case row with release runway

                  The whole book as one section

                  Board, with permission built in

                  Drag a card. A case with a factor still not low risk cannot be dropped on Approval.

                  The assistant flags, a person decides

                  When things are not fine

                  The unhappy paths are designed, not left to chance.

                  First run
                  No results
                  Loading
                  .
                  .
                  .
                  .
                  Permission denied

                  Motion and sound

                  Marimba and xylophone bars are cut from rosewood, so the portal is tuned like one. Sound is off until you turn it on, and every sound means something. Motion follows the same rule. Reduced motion is honoured everywhere.

                    Iconography

                    One family, drawn for this product. 24 px grid, 1.5 px stroke, round caps. Status shapes are part of the set.

                      What we will not do

                      Written down so it can be held to.