Skip to content

CoreTender Enterprise Design System™

One design language for every CoreTender capability

CEDS™ is the visual, interaction, accessibility and usability foundation of CoreTender Procurement OS™. Every page, component, workflow, AI interaction, dashboard and administration surface is composed from the tokens and primitives documented here. The simplicity of Notion, Linear and Stripe with the governance depth of an enterprise procurement platform.

Design principles

Ten rules that decide every design argument. When two options are both reasonable, the one that satisfies more of these wins.

  • Simplicity over complexity

    Every screen states one job first; depth is reachable, never in the way.

  • AI-first interactions

    The Copilot is a teammate in the surface, not a separate destination.

  • Progressive disclosure

    Summary → detail → evidence. Never all three at once.

  • Consistency everywhere

    Same navigation, same tabs, same semantics in every module.

  • Accessibility by default

    WCAG 2.2 AA is the floor, verified per component.

  • Minimal clicks

    Every primary action reachable in two interactions or one keystroke.

  • Mobile responsive

    Layouts adapt; functionality is never removed on small screens.

  • Keyboard accessible

    Full keyboard path plus ⌘K for everything.

  • Fast performance

    Skeletons over spinners; never block on non-critical data.

  • Human-centered design

    AI proposes with confidence and sources; humans approve.

Color system

Brand foundation plus procurement semantics. Colour always carries a text label: meaning never depends on hue alone.

Brand foundation

Ink (Black)

--navy

Primary brand surface, headings, dark bands.

Ink Deep

--navy-deep

Deepest contrast band and hover state for ink surfaces.

Gold

--gold

Accent only: focus rings, primary CTA, key emphasis.

White

--background

Base canvas in light theme.

Surface

--surface

Neutral page section separation.

Surface raised

--surface-raised

Cards and panels lifted above the canvas.

Surface sunken

--surface-sunken

Wells, code blocks, inset regions.

Procurement semantics

Success

Ready, compliant, submitted, won, healthy.

Warning

At risk, expiring, SLA nearing breach, partial evidence.

Danger

Blocked, non-compliant, breached, integrity failure.

Info

Neutral state, in review, informational guidance.

AI

Anything generated or suggested by the AI Procurement Copilot™.

CompliantExpiring in 14 daysBlocking gapIn reviewAI suggestedReady · 91At risk · 58

Typography hierarchy

Poppins for headings, Inter for everything else.

  • Display

    Marketing heroes only.

  • Heading 1

    Page title.

  • Heading 2

    Section title.

  • Heading 3

    Panel and card title.

  • Body

    Default application text.

  • Body large

    Editorial and long-form reading.

  • Caption

    Hints, metadata, table sub-values.

  • Eyebrow

    Labels above titles and metric names.

Spacing: 8pt grid

Every gap, pad and stack comes from this scale.

  • 2xs0.25rem
  • xs0.5rem
  • sm0.75rem
  • md1rem
  • lg1.5rem
  • xl2rem
  • 2xl3rem
  • 3xl5rem

Radius, elevation & motion

Depth communicates layer; motion communicates causality.

  • sm, Chips, tags, inline controls.
  • md, Inputs and buttons.
  • lg, Default surface radius.
  • xl, Cards and panels.
  • 2xl, Dialogs, drawers, hero surfaces.
Elevation 1
Elevation 2
Elevation 3
Elevation 4
  • fast · 120ms, State toggles, hover, checkbox.
  • base · 200ms, Default transitions and reveals.
  • slow · 320ms, Drawers, dialogs, page-level motion.
  • ease-standard · cubic-bezier(0.2, 0, 0, 1), Most transitions.
  • ease-entrance · cubic-bezier(0.22, 1, 0.36, 1), Entering surfaces.

Dashboard framework

KPI cards, health indicators, progress and alerts share one shape so any widget can live in any dashboard.

Readiness

82

6 ptsLast 30 days
Live opportunities

14

2
Expiring evidence

3

1
Active buyers

9

Across 4 countries
Submission completeness78%

19 of 25 components complete

Compliance coverage94%
Pricing confidence46%

Two cost lines unverified

  1. Submission package generated

    2h ago
  2. Tax clearance flagged expiring

    Yesterday
    Renewal owner assigned to Finance.
  3. Copilot drafted the technical response

    2 days ago
  4. Opportunity qualified

    5 days ago

Data grid

Sortable, filterable, screen-reader correct. One table component for every module.

Example opportunity pipeline
National grid metering rolloutMinistry of PowerReady · 9112 Sep
Regional logistics frameworkPorts AuthorityNearly ready · 7428 Aug
Clinical supplies renewalHealth ServiceAt risk · 5805 Oct
Data centre managed servicesFederal RevenueNot ready · 4119 Aug

Workspace experience

Every procurement opportunity presents the identical eleven sections, in the identical order, with the identical navigation.

Overview: this section keeps the same layout grammar in every workspace: summary first, detail on demand, evidence one level deeper.

Global search

One intelligent index across every entity, with filters, saved searches and recent activity.

OpportunitiesDocumentsSuppliersContractsUsersOrganizationsAI conversationsTemplatesReports

Command palette

Press ⌘K (Ctrl-K) anywhere on the platform. Keyboard-first is the fastest path to every action.

⌘K
  • Open Home
  • Open Procurement Home
  • Search everything
  • Open Procurement Planning
  • Open Tender Management
  • Open Evaluation
  • Open Award Management
  • Open Closeout and Archive
  • Open recent records and favorites
  • Open Platform overview
  • Open Procurement OS™
  • Open Readiness dashboard

AI experience

The AI Procurement Copilot™ behaves like a teammate: it states confidence, cites sources, shows its reasoning, and always hands the decision to a human.

What is blocking this bid?
AI Procurement Copilot™
High confidence · 86%
Two blocking gaps. Renew the tax clearance before 2 September and attach local content evidence for section 4.3: closing both moves readiness from 74 to an estimated 89.
Reasoning summary

Two of 23 readiness dimensions are below threshold. The tax clearance expires before the submission date, and the local content declaration has no supporting evidence attached.

  • Tax clearance 2025.pdf

    Evidence Vault · expires 2 Sep

  • ITT Section 4.3

    Local content requirement

Requires human approval
Current position compared with Copilot recommendation
DimensionCurrent positionCopilot recommendation
Readiness74 · At risk89 · Ready
PricingCost-plus 18%Blended 14% with volume commitment
PartnerNoneLocal integrator for 30% content

Forms & inputs

Labelled, described, inline-validated and keyboard complete.

We only use this for procurement notifications.

Empty, loading & error states

Every asynchronous surface ships all three.

No opportunities yet

Connect a source or add your first opportunity to start scoring readiness.

  • Tip: ⌘K → Create opportunity
  • Tip: the Copilot can qualify a tender from a PDF
Loading

Page template

The standard application surface. Breadcrumb, title, description, one primary action, secondary actions, help, context rail and an AI panel that is always reachable.

National grid metering rollout

At risk, readiness 74

Open tender from the Ministry of Power. Submission closes in 12 days. Readiness is improving but two required documents are still outstanding.

  • Where am I?

    Breadcrumb, page title and the active navigation item.

  • What am I doing?

    One page description in plain language plus the current status.

  • What needs my attention?

    Alert banner, risk cards and the AI summary in the context rail.

  • What should I do next?

    Exactly one primary action, with secondary actions demoted.

AI component standard

Every major page carries a summary, ranked actions, named risks, suggested improvements, a way to ask, a confidence value and an explanation that opens in place.

Close two gaps to move this bid to ready

Readiness is 74. Renewing the tax clearance and attaching local content evidence lifts the estimate to 89 before the deadline.

High confidence, 86%
  • AI summary

    Every major page opens with a short, current summary of its state.

  • Recommended actions

    Ranked, specific and executable from the surface they appear on.

  • Potential risks

    Named with severity, never a generic caution.

  • Suggested improvements

    Optional gains, kept separate from blocking risks.

  • Ask AI

    A persistent way to ask about the current record without changing pages.

  • AI confidence

    A percentage and a band on every generated recommendation.

  • Explain recommendation

    Reasoning and evidence expand in place, never in a new destination.

AI summary

82%

This pursuit is competitive on price and weak on documentation. Two required items are outstanding and both have named owners.

Recommended actions

  • Renew the tax clearance before 2 September.
  • Attach three comparable references to section 4.3.
  • Confirm the bid bond issuer with Treasury.

Potential risks

  • Tax clearance expires before the submission date.
  • Local content evidence is missing.

Suggested improvements

  • Add the recent metering case study to strengthen the technical response.

Table standard

One table primitive delivers search, sorting, saved views, a column chooser, export, bulk actions, paging and keyboard navigation. No module builds its own.

Opportunity pipeline
Actions
National grid metering rolloutMinistry of PowerProposal18.4M91
Regional logistics frameworkPorts AuthorityQualification7.2M74
Clinical supplies renewalHealth ServicePricing4.1M58
Data centre managed servicesFederal RevenueReview12.8M41
Campus estates maintenanceUniversity BoardSubmission2.6M88
Showing 5 of 5 records
Page 1 of 1
  • Search

    One search field filters across every column value, case insensitive.

  • Sorting

    Column headers are buttons and publish aria-sort on the active column.

  • Filtering

    Filters narrow the record set and always report the filtered count.

  • Saved views

    Named views are shared with the organization and remembered per user.

  • Column chooser

    Optional columns are hidden by default and restorable without a reload.

  • Export

    CSV export honours the active filters, sort order and visible columns.

  • Bulk actions

    Selection shows a bulk bar with the count and a clear selection control.

  • Inline editing

    Only for low-risk fields, with autosave and an undo path.

  • Keyboard navigation

    Rows are focusable, Enter opens the record, Escape clears selection.

  • Accessibility

    A caption, scoped headers and a text label on every checkbox.

Form standard

Autosave, validation, guidance, AI suggestions, progress, draft mode and an unsaved changes warning are properties of the shell, not of each form.

Organization profile

Draft

Used by the Readiness Engine and every proposal you generate.

Saved at 14:02
7 of 12 fields complete58%

Exactly as printed on the certificate.

This number is not recognised by the registry.

  • Autosave

    Debounced save with a visible state: unsaved, saving, saved with a time.

  • Validation

    Inline messages on blur, plus an error summary that links to each field.

  • Helpful guidance

    A guidance rail explains why the information is needed, not just what.

  • AI suggestions

    Suggestions are proposals with confidence, applied only by the user.

  • Progress

    Completion count and percentage for any form longer than one screen.

  • Draft mode

    Drafts are first class, visibly labelled and never lost on navigation.

  • Unsaved changes

    Leaving with unsaved work warns before the change is discarded.

Workflow template

Every multi-step process shows progress, the current step, completed steps, the next action, effort estimates, owners and an AI recommendation.

Progress

1 of 5 steps complete. Current step: Close readiness gaps, about 2 days

20%
  1. Qualify the opportunityBid manager30 minutescomplete
  2. Close readiness gapsTwo required documents outstanding.Compliance2 dayscurrent
  3. Price the bidCommercial1 dayupcoming
  4. Internal approvalExecutive reviewer4 hoursupcoming
  5. SubmitBlocked until approval is recorded.Bid managerblocked

AI recommendation. Start the tax clearance renewal today. It is the only step that cannot be compressed later.

Organization

Confirm the legal entity that will submit.

One decision per step keeps long setup flows calm.

Step 1 of 3
  • Progress tracker

    Percentage complete plus the count of finished steps.

  • Current step

    One step is marked current with aria-current and a distinct surface.

  • Completed steps

    Completed work stays visible and re-openable for review.

  • Next action

    One primary control moves the process forward.

  • Estimated time

    Each step carries a realistic effort estimate.

  • Assigned users

    Owner names appear on the step, not only in a separate table.

  • AI recommendations

    The Copilot proposes the fastest safe path with its reasoning.

Qualify

1
  • Rail signalling upgrade

    Closes in 21 days

Prepare

1
  • Clinical supplies renewal

    Readiness 58

    At risk

Approve

1
  • Campus estates maintenance

    Awaiting executive review

Submitted

0
  • Nothing here yet

Security component standard

Security is visible and never intimidating. Plain language first, technical detail on request, always tied to a real control.

Security on this record

  • Identity verified

    We confirmed who this person is before granting access.

  • Multi-factor enabled

    A second check is required when signing in.

  • Encrypted

    This document is protected in storage and in transit.

  • Audit logged

    Every view, download and change is recorded and cannot be edited.

  • Approval required

    Two named people must agree before this takes effect.

Grant finance access to the evidence vault

Requested by Adaeze Okonjo on 12 August. Decision needed by 14 August

pendinghigh risk
  • Tunde Balogun, Organization ownerapproved
  • Grace Mwangi, Compliance officerWaiting

Every decision is recorded in the tamper-evident audit trail with the approver identity and time.

  • Identity verified

    We confirmed who this person is before granting access.

  • Multi-factor enabled

    A second check is required when signing in.

  • Encrypted

    This document is protected in storage and in transit.

  • Audit logged

    Every view, download and change is recorded and cannot be edited.

  • Approval required

    Two named people must agree before this takes effect.

  • Access expires

    Access ends automatically on the date shown, without an action from you.

Risk, evidence and document cards

Four content cards cover most enterprise screens. Reuse them instead of inventing a new card for the same job.

Compliance

Tax clearance expires before submission

critical
Likelihood
Certain
Impact
Disqualification
Owner
Finance

Mitigation. Start the renewal today and attach the receipt as interim evidence.

Certificate of incorporation.pdf

Corporate · Company secretary · Issued 2019

Verified

Local content declaration.docx

Compliance · Compliance

Awaiting verification

Invitation to tender.pdf

Ministry of Power · 48 pages

Preview renders inside this frame. Downloads and prints are logged against the document record so the access history stays complete.

Charts and measurement

Chart primitives are token driven and always pair the visual with a readable value, so meaning never depends on color alone.

74out of 100
Procurement Readiness ScoreAt risk band
AprReadiness trendAug
  • Compliance94%
  • Commercial71%
  • Technical88%
  • Delivery46%

Collaboration and activity

Comments, tasks, checklists and activity share one presentation, so history reads the same in every module.

Tasks

1 of 3 done

Submission readiness

2 of 4 complete, 2 required items outstanding

50%

Discussion

2
  1. Grace MwangiCompliance officer2 hours ago

    Renewal receipt is with the revenue office. I will attach it as interim evidence today.

    • renewal-receipt.pdf
  2. Tunde BalogunOrganization ownerYesterdayResolved

    Approved the approach. Keep the submission date unchanged.

Activity

  1. Copilot drafted the technical response for section 4.3

    1 hour ago

  2. Grace Mwangi flagged tax clearance

    3 hours ago

  3. Tunde Balogun approved the pricing model

    Yesterday

Messaging, disclosure and notifications

Page level messages, expandable reference content and the shared notification inbox.

Two required documents are outstanding

The submission cannot be sent until both items are attached and verified.

Submission package generated

All 25 components passed the consistency checks.

A document is verified when its issuer, issue date and expiry are confirmed and it is linked to a requirement.

  • Approval requested

    10 minutes ago

    Finance access to the evidence vault.

  • Readiness improved to 74

    2 hours ago

    Two dimensions moved above threshold.

  • Copilot drafted a section

    Yesterday

    Technical approach, section 4.3.

Interaction standards

How the platform behaves, independent of what it shows.

  • One primary action

    A single filled button per screen region. Everything else is outline or ghost.

  • Progressive disclosure

    Summary first, detail on request, evidence last.

  • Optimistic feedback

    Interactions acknowledge within 100ms, even when the result is pending.

  • Destructive confirmation

    Irreversible actions state the consequence before the confirm control.

  • Motion with meaning

    Motion shows origin and relationship. It respects reduced motion settings.

  • Never a dead end

    Empty, error and permission states always offer a next step.

Performance standards

Speed is a design property, decided at build time.

  • Skeleton loaders

    Skeletons mirror the shape of the real content. Spinners are a last resort.

  • Lazy loading

    Below-the-fold panels and heavy modules load on demand.

  • Paged and virtualized tables

    Large record sets page by default and never render every row.

  • Optimized rendering

    Derived values are memoized; lists carry stable keys.

  • Non-blocking data

    Critical data blocks the route; secondary data streams in.

Responsive behaviour

Layouts adapt across four widths. Functionality is never removed on a smaller screen.

  • Mobile

    up to 639px

    Single column, sticky primary action, rail content collapses into panels.

  • Tablet

    640px to 1023px

    Two column content, rail moves below the main region.

  • Laptop

    1024px to 1279px

    Main region with collapsible navigation, rail on demand.

  • Desktop

    1280px and above

    Main region plus persistent context rail and AI panel.

Extensibility

New modules join the platform by composing this language. CoreProjects, CoreGov, CoreAssets, CoreAudit, CoreRisk and CoreSecurity need no redesign.

  • Compose CEDS™ primitives. A module never ships its own button, table, card or badge.
  • Register new terminology in the CoreTender Product Dictionary™ before it appears in the interface.
  • Use PageTemplate so navigation, context rail, AI panel and help behave identically.
  • Express every state through the shared tone vocabulary: neutral, success, warning, danger, info, ai.
  • Add a genuinely new pattern to CEDS™ first, document it here, then use it in the module.
  • Future modules such as CoreProjects, CoreGov, CoreAssets, CoreAudit, CoreRisk and CoreSecurity inherit this language unchanged.

Ship checklist

Reviewed before any new CoreTender screen is released. A screen that fails one line is not finished.

  1. 1Breadcrumb, title, description and exactly one primary action are present.
  2. 2The page answers all four core questions above the fold.
  3. 3Every state has a design: loading, empty, error, permission denied and success.
  4. 4Tables meet the table standard; forms meet the form standard.
  5. 5Security assurances are stated in plain language with expandable detail.
  6. 6The AI summary, confidence and explanation are available on the surface.
  7. 7Keyboard path is complete and the focus ring is visible on every control.
  8. 8Contrast passes WCAG 2.2 AA in both light and dark themes.
  9. 9Layout works at mobile, tablet, laptop and desktop widths with no lost function.
  10. 10Copy follows the CoreTender content style guide.

Accessibility: WCAG 2.2 AA

Not a review stage. A build-time property of every component.

  • WCAG 2.2 AA contrast for text, icons and chart series in both themes.
  • Visible 2px gold focus ring on every interactive element, never removed.
  • Skip-to-content link as the first tab stop on every page.
  • Tables use real th/scope markup with captions for screen readers.
  • Charts ship an accessible data table fallback, never colour alone.
  • High-contrast and reduced-motion are user preferences, not OS-only.
  • Tap targets are at least 44×44px on touch viewports.

Iconography & illustration

One icon library, one illustration language, zero AI clichés.

  • lucide-react is the only icon library; never mix icon sets.
  • Inline icon size is 16px (size-4); standalone controls use 20px (size-5).
  • Icons are decorative by default. Add aria-hidden and label the control.
  • Never use a sparkle as the AI identity; use the Copilot mark.
  • Illustration style: flat geometric line work in ink + gold, no gradients, no robots or brains.

See CEDS™ at work across the Procurement OS