New:Introducing Socket Scanning for VS Code Marketplace Extensions.Learn more →
Get Started

@polyxd/ds-finance

Package Overview
Dependencies
Maintainers
1
Versions
8
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@polyxd/ds-finance

Finance template pack for Polyxd (DTCG 2025.10 tokens): an original design to start from and make your own

latest
Source
npmnpm
Version
0.4.6
Version published
Maintainers
1
Created
Source

@polyxd/ds-finance

Finance — an original Polyxd template pack. Navy and gold, tabular numerals, conservative radii, dense tables; banking and trading.

Navy for the primary action and the inverse surface, gold for focus, selection and warnings, a serif only for titles and key figures, and everything else the system sans in small sizes with tight spacing so a table of positions fits. Radii stop at 4px. Shadows are a hairline. Key figures are tabular so columns of numbers line up. Dark mode swaps the roles: gold becomes the primary on navy. For banking, trading, treasury and any product where the numbers are the interface.

This is a template: not a reproduction of any design system, and meant to be changed. Start from it, keep what you like, and it stays a valid pack as long as polyxd check passes.

npx polyxd check packages/ds-finance/manifest.json   # every contract token, every contrast pair, both modes

Make it yours

Two ways in.

Edit these tokens. Every colour role in tokens/system.light.json and tokens/system.dark.json points at a named entry in that file's palette; change a palette entry and every role using it follows, or point a role at another entry to change one thing. Type, spacing, radii and motion are in tokens/system.json. tokens/semantic.json only aliases those and rarely needs touching. Run polyxd check after each change: it names any pair that no longer meets its contrast floor.

Or start from your own tokens. npx polyxd pack ./your-tokens.css --name yours drafts a pack from a stylesheet or a DTCG file and writes a mapping you correct; this template is then a reference for what each role is for.

Either way, rename it: name in manifest.json is the theme a surface asks for, and [data-pxd-theme="<name>"] is the selector the compiled CSS uses.

Fonts

RoleFamilyFull stack
displayGeorgiaGeorgia, 'Times New Roman', Times, serif
bodysystem-uisystem-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif
labelsystem-uisystem-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif
monoui-monospaceui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace

Web fonts: None. The pack uses the reader's system fonts, so there is nothing to load.

Notes on the values

  • Gold (#a67c0c) is the focus ring in light mode at 3.7:1 on white — bright enough to see, and the one place the accent is allowed to be loud.
  • type.numeric.display and the tables are set with tabular numerals by the renderer; the pack's job is to give them a serif with real lining figures (Georgia has them).

Files

FileWhat it holds
manifest.jsonName, modes, default mode and provenance
tokens/system.jsonPrimitives both modes share: fonts, sizes, spacing, radii, borders, motion
tokens/system.light.json, tokens/system.dark.jsonThe palette and the finance.sys.* roles for each mode, plus shadows
tokens/semantic.jsonThe Polyxd contract, aliasing finance.*

Licence Apache-2.0, like the rest of Polyxd. Provenance in the manifest: original template by Polyxd.

logo.svg is Polyxd's own mark for this template, not anyone's logo: a small card drawn only from the template's tokens in its default mode (the ground, strong border and radius, the text and muted text, the primary action and one accent). packages/ds-kit/scripts/pack-logos.ts draws it, so it follows the tokens: change them and run node packages/ds-kit/scripts/pack-logos.ts to redraw it. A test fails if it goes stale.

FAQs

Package last updated on 09 Oct 2026

Related posts