{"_id":"@021.is/brand-studio","_rev":"5-6ab5bb18c66398f0b45157bc2a64a65a","name":"@021.is/brand-studio","dist-tags":{"latest":"0.6.8"},"versions":{"0.3.0":{"name":"@021.is/brand-studio","version":"0.3.0","keywords":["brand","design-system","material-design-3","md3","color-scheme","react","react-19","svg","framer-motion","design-tokens"],"author":{"url":"https://edvone.dev","name":"edvone"},"license":"MIT","_id":"@021.is/brand-studio@0.3.0","maintainers":[{"name":"edvone","email":"edvard@edvone.dev"}],"homepage":"https://github.com/021is/brand-studio#readme","bugs":{"url":"https://github.com/021is/brand-studio/issues"},"dist":{"shasum":"b24378e186c0bbf306f6621b5787bb0b379e8fd2","tarball":"https://registry.npmjs.org/@021.is/brand-studio/-/brand-studio-0.3.0.tgz","fileCount":29,"integrity":"sha512-5zaYySBNnYUanODWlQXHJ/A+JQf9sl8E2D0cuuYORtTdrzDr+blgOEuhwp3y+EIIWL77bMFJ4z8wYEzcIPIFBg==","signatures":[{"sig":"MEYCIQCA95pua3kxChq15xMuSvJYYlg175o0kmjFhTQ/3qGjWwIhAJf+khoEphefAYE/axulXGg7kve9V5YY0ztLQEsoCR21","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":212304},"type":"module","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js"},"./app":{"types":"./dist/app/index.d.ts","import":"./dist/app/index.js"},"./color":{"types":"./dist/color/index.d.ts","import":"./dist/color/index.js"},"./define":{"types":"./dist/define/index.d.ts","import":"./dist/define/index.js"},"./motion":{"types":"./dist/motion/index.d.ts","import":"./dist/motion/index.js"},"./shapes":{"types":"./dist/shapes/index.d.ts","import":"./dist/shapes/index.js"},"./loading":{"types":"./dist/loading/index.d.ts","import":"./dist/loading/index.js"}},"gitHead":"4b355212b98c4ecf3e2087d4f950f7c8cc3a884c","private":false,"scripts":{"dev":"tsup --watch","lint":"biome check src","test":"vitest run","build":"tsup && node scripts/add-use-client.mjs","typecheck":"tsc --noEmit","prepublishOnly":"bun run typecheck && bun run lint && bun run test && bun run build"},"_npmUser":{"name":"edvone","email":"edvard@edvone.dev"},"repository":{"url":"git+https://github.com/021is/brand-studio.git","type":"git"},"_npmVersion":"10.9.4","description":"Generic MD3 brand-kit toolkit: seed → full light + dark role set, composable SVG shapes + motion + loading marks, and a mountable /brand page. Ships no brand content — every app supplies its own logo, icons, and seed colour.","directories":{},"sideEffects":false,"_nodeVersion":"22.22.0","publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.3.0","react":"^19.0.0","vitest":"^2.1.0","react-dom":"^19.0.0","typescript":"^5.6.0","@types/react":"^19.0.0","framer-motion":"^12.0.0","@biomejs/biome":"^1.9.0","@types/react-dom":"^19.0.0","@material/material-color-utilities":"^0.3.0"},"peerDependencies":{"react":"^19.0.0","react-dom":"^19.0.0","framer-motion":"^11.0.0 || ^12.0.0"},"_npmOperationalInternal":{"tmp":"tmp/brand-studio_0.3.0_1780507899235_0.5307259634059773","host":"s3://npm-registry-packages-npm-production"}},"0.6.0":{"name":"@021.is/brand-studio","version":"0.6.0","keywords":["brand","design-system","material-design-3","md3","color-scheme","react","react-19","svg","framer-motion","design-tokens"],"author":{"url":"https://edvone.dev","name":"edvone"},"license":"MIT","_id":"@021.is/brand-studio@0.6.0","maintainers":[{"name":"edvone","email":"edvard@edvone.dev"}],"homepage":"https://github.com/021is/brand-studio#readme","bugs":{"url":"https://github.com/021is/brand-studio/issues"},"dist":{"shasum":"52d7f8228cf78041ccaf675672dd6baa16955721","tarball":"https://registry.npmjs.org/@021.is/brand-studio/-/brand-studio-0.6.0.tgz","fileCount":30,"integrity":"sha512-2m6swJgsHIyWQ7kMEtbUBma25dEfjg6jKUuc9AMJPfcwRKRMn/ukVxUke1PQ9oHZ57VZkccGuH0GR2sAtzTIKA==","signatures":[{"sig":"MEUCIHVyyPCupCWYkZbOz8mOPbMaB9FYKn1egDnOdl+JPxSHAiEAtGDM0yiNJ0WqEIyTv6W0MFA3ginjZQE2x3lF9gmTXFQ=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":226271},"type":"module","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js"},"./app":{"types":"./dist/app/index.d.ts","import":"./dist/app/index.js"},"./color":{"types":"./dist/color/index.d.ts","import":"./dist/color/index.js"},"./define":{"types":"./dist/define/index.d.ts","import":"./dist/define/index.js"},"./motion":{"types":"./dist/motion/index.d.ts","import":"./dist/motion/index.js"},"./shapes":{"types":"./dist/shapes/index.d.ts","import":"./dist/shapes/index.js"},"./loading":{"types":"./dist/loading/index.d.ts","import":"./dist/loading/index.js"}},"gitHead":"e89dee2b0f3657cd67975096232c68a5c142a8c8","private":false,"scripts":{"dev":"tsup --watch","lint":"biome check src","test":"vitest run","build":"tsup && node scripts/add-use-client.mjs","typecheck":"tsc --noEmit","prepublishOnly":"bun run typecheck && bun run lint && bun run test && bun run build"},"_npmUser":{"name":"edvone","email":"edvard@edvone.dev"},"repository":{"url":"git+https://github.com/021is/brand-studio.git","type":"git"},"_npmVersion":"10.9.4","description":"Generic MD3 brand-kit toolkit: seed → full light + dark role set, composable SVG shapes + motion + loading marks, mountable /brand page, mandatory icon + logo download-URL contract. Ships no brand content — every app supplies its own logo, i","directories":{},"sideEffects":false,"_nodeVersion":"22.22.0","publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.3.0","react":"^19.0.0","vitest":"^2.1.0","react-dom":"^19.0.0","typescript":"^5.6.0","@types/react":"^19.0.0","framer-motion":"^12.0.0","@biomejs/biome":"^1.9.0","@types/react-dom":"^19.0.0","@material/material-color-utilities":"^0.3.0"},"peerDependencies":{"react":"^19.0.0","react-dom":"^19.0.0","framer-motion":"^11.0.0 || ^12.0.0"},"_npmOperationalInternal":{"tmp":"tmp/brand-studio_0.6.0_1780591067643_0.2767950107075854","host":"s3://npm-registry-packages-npm-production"}},"0.6.1":{"name":"@021.is/brand-studio","version":"0.6.1","keywords":["brand","design-system","material-design-3","md3","color-scheme","react","react-19","svg","framer-motion","design-tokens"],"author":{"url":"https://edvone.dev","name":"edvone"},"license":"MIT","_id":"@021.is/brand-studio@0.6.1","maintainers":[{"name":"edvone","email":"edvard@edvone.dev"}],"homepage":"https://github.com/021is/brand-studio#readme","bugs":{"url":"https://github.com/021is/brand-studio/issues"},"dist":{"shasum":"e60664f0caf4296d6c687a28718baa6763ad9f1c","tarball":"https://registry.npmjs.org/@021.is/brand-studio/-/brand-studio-0.6.1.tgz","fileCount":30,"integrity":"sha512-KDRXp1S7fsfjcX9fIdsbXC3SSsVC+/oUK3ClskC3AUhxRB5j4xmaibtOipcWxKNk3/xJED49iEBJs00q4VKw3A==","signatures":[{"sig":"MEUCIQDKcFA6aArsx5O9DoorAhLIm4QUbqRb69vVyyVhA2sOmgIgBV2HRY8xqaAQ3T8t4WMFSkjhsrOCIQZRcFdrtBrfNu0=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":227175},"type":"module","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js"},"./app":{"types":"./dist/app/index.d.ts","import":"./dist/app/index.js"},"./color":{"types":"./dist/color/index.d.ts","import":"./dist/color/index.js"},"./define":{"types":"./dist/define/index.d.ts","import":"./dist/define/index.js"},"./motion":{"types":"./dist/motion/index.d.ts","import":"./dist/motion/index.js"},"./shapes":{"types":"./dist/shapes/index.d.ts","import":"./dist/shapes/index.js"},"./loading":{"types":"./dist/loading/index.d.ts","import":"./dist/loading/index.js"}},"gitHead":"fdcbe342b39fdec3a6715465c45eb68cf06807a4","private":false,"scripts":{"dev":"tsup --watch","lint":"biome check src","test":"vitest run","build":"tsup && node scripts/add-use-client.mjs","typecheck":"tsc --noEmit","prepublishOnly":"bun run typecheck && bun run lint && bun run test && bun run build"},"_npmUser":{"name":"edvone","email":"edvard@edvone.dev"},"repository":{"url":"git+https://github.com/021is/brand-studio.git","type":"git"},"_npmVersion":"10.9.4","description":"Generic MD3 brand-kit toolkit: seed → full light + dark role set, composable SVG shapes + motion + loading marks, mountable /brand page, mandatory icon + logo download-URL contract. Ships no brand content — every app supplies its own logo, i","directories":{},"sideEffects":false,"_nodeVersion":"22.22.0","publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.3.0","react":"^19.0.0","vitest":"^2.1.0","react-dom":"^19.0.0","typescript":"^5.6.0","@types/react":"^19.0.0","framer-motion":"^12.0.0","@biomejs/biome":"^1.9.0","@types/react-dom":"^19.0.0","@material/material-color-utilities":"^0.3.0"},"peerDependencies":{"react":"^19.0.0","react-dom":"^19.0.0","framer-motion":"^11.0.0 || ^12.0.0"},"_npmOperationalInternal":{"tmp":"tmp/brand-studio_0.6.1_1780596803108_0.8073497585087661","host":"s3://npm-registry-packages-npm-production"}},"0.6.7":{"name":"@021.is/brand-studio","version":"0.6.7","keywords":["brand","design-system","material-design-3","md3","color-scheme","react","react-19","svg","framer-motion","design-tokens"],"author":{"url":"https://edvone.dev","name":"edvone"},"license":"MIT","_id":"@021.is/brand-studio@0.6.7","maintainers":[{"name":"edvone","email":"edvard@edvone.dev"}],"homepage":"https://github.com/021is/brand-studio#readme","bugs":{"url":"https://github.com/021is/brand-studio/issues"},"dist":{"shasum":"ac411989cdcc00a214eb21f9291c654ea9581319","tarball":"https://registry.npmjs.org/@021.is/brand-studio/-/brand-studio-0.6.7.tgz","fileCount":30,"integrity":"sha512-aYgqiFhm3NrJTQdZw6T9M6zVJPXtoLUNJd9h7Kqx8B1RYogOk2LzuU5TJRP1XwLbpQP19w0tSCyEVS4fHTlXeg==","signatures":[{"sig":"MEUCIQD4YqECRoXs8Gm27JgvBi0yCbfPADfyiKYVjC3mHw5lHgIgFLQXuyJjvAmQZXOKzaoEkUQs8KdkMonB2AbLdAzqABw=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":224971},"type":"module","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js"},"./app":{"types":"./dist/app/index.d.ts","import":"./dist/app/index.js"},"./color":{"types":"./dist/color/index.d.ts","import":"./dist/color/index.js"},"./define":{"types":"./dist/define/index.d.ts","import":"./dist/define/index.js"},"./motion":{"types":"./dist/motion/index.d.ts","import":"./dist/motion/index.js"},"./shapes":{"types":"./dist/shapes/index.d.ts","import":"./dist/shapes/index.js"},"./loading":{"types":"./dist/loading/index.d.ts","import":"./dist/loading/index.js"}},"gitHead":"d8904b60a8d533bdac2294c4ff6cb9039f5d8fd2","private":false,"scripts":{"dev":"tsup --watch","lint":"biome check src","test":"vitest run","build":"tsup && node scripts/add-use-client.mjs","typecheck":"tsc --noEmit","prepublishOnly":"bun run typecheck && bun run lint && bun run test && bun run build"},"_npmUser":{"name":"edvone","email":"edvard@edvone.dev"},"repository":{"url":"git+https://github.com/021is/brand-studio.git","type":"git"},"_npmVersion":"10.9.4","description":"Generic MD3 brand-kit toolkit: seed → full light + dark role set, composable SVG shapes + motion + loading marks, mountable /brand page, mandatory icon + logo download-URL contract. Ships no brand content — every app supplies its own logo, i","directories":{},"sideEffects":false,"_nodeVersion":"22.22.0","publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.3.0","react":"^19.0.0","vitest":"^2.1.0","react-dom":"^19.0.0","typescript":"^5.6.0","@types/react":"^19.0.0","framer-motion":"^12.0.0","@biomejs/biome":"^1.9.0","@types/react-dom":"^19.0.0","@material/material-color-utilities":"^0.3.0"},"peerDependencies":{"react":"^19.0.0","react-dom":"^19.0.0","framer-motion":"^11.0.0 || ^12.0.0"},"_npmOperationalInternal":{"tmp":"tmp/brand-studio_0.6.7_1781250335925_0.3804705022778112","host":"s3://npm-registry-packages-npm-production"}},"0.6.8":{"name":"@021.is/brand-studio","version":"0.6.8","description":"Generic MD3 brand-kit toolkit: seed → full light + dark role set, composable SVG shapes + motion + loading marks, mountable /brand page, mandatory icon + logo download-URL contract. Ships no brand content — every app supplies its own logo, i","license":"MIT","author":{"name":"edvone","url":"https://edvone.dev"},"homepage":"https://github.com/021is/brand-studio#readme","bugs":{"url":"https://github.com/021is/brand-studio/issues"},"repository":{"type":"git","url":"git+https://github.com/021is/brand-studio.git"},"keywords":["brand","design-system","material-design-3","md3","color-scheme","react","react-19","svg","framer-motion","design-tokens"],"private":false,"type":"module","sideEffects":false,"exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js"},"./shapes":{"types":"./dist/shapes/index.d.ts","import":"./dist/shapes/index.js"},"./motion":{"types":"./dist/motion/index.d.ts","import":"./dist/motion/index.js"},"./loading":{"types":"./dist/loading/index.d.ts","import":"./dist/loading/index.js"},"./color":{"types":"./dist/color/index.d.ts","import":"./dist/color/index.js"},"./app":{"types":"./dist/app/index.d.ts","import":"./dist/app/index.js"},"./define":{"types":"./dist/define/index.d.ts","import":"./dist/define/index.js"}},"scripts":{"build":"tsup && node scripts/add-use-client.mjs","dev":"tsup --watch","typecheck":"tsc --noEmit","lint":"biome check src","test":"vitest run","prepublishOnly":"bun run typecheck && bun run lint && bun run test && bun run build"},"peerDependencies":{"framer-motion":"^11.0.0 || ^12.0.0","react":"^19.0.0","react-dom":"^19.0.0"},"devDependencies":{"@biomejs/biome":"^1.9.0","@material/material-color-utilities":"^0.3.0","@types/react":"^19.0.0","@types/react-dom":"^19.0.0","framer-motion":"^12.0.0","react":"^19.0.0","react-dom":"^19.0.0","tsup":"^8.3.0","typescript":"^5.6.0","vitest":"^2.1.0"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"_id":"@021.is/brand-studio@0.6.8","gitHead":"53c6897399d92f150838239dc92a4de4e28b814c","_nodeVersion":"22.22.0","_npmVersion":"10.9.4","dist":{"integrity":"sha512-zIjg+1AzaVW7bcB6WPH7dtnci4qFI1v1QjtHjRh177DaAyjyBFT8h9mtxxCdNjAwFgtZN9aJsIS+1Q0aYC0X5A==","shasum":"f0128184d02a1651efed77bc7798998058b21566","tarball":"https://registry.npmjs.org/@021.is/brand-studio/-/brand-studio-0.6.8.tgz","fileCount":30,"unpackedSize":225184,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQCqc6A6Fcf/pgaOSbuXnWXMPnFspOH3WBQ6net6/nzhQAIgTPaCrPp0/3T8rs9yiCIlOPkO/nz3LGwGmWJ27nWYKFs="}]},"_npmUser":{"name":"edvone","email":"edvard@edvone.dev"},"directories":{},"maintainers":[{"name":"edvone","email":"edvard@edvone.dev"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/brand-studio_0.6.8_1782053321159_0.3674059571518711"},"_hasShrinkwrap":false}},"time":{"created":"2026-06-03T17:31:39.007Z","modified":"2026-06-21T14:48:41.449Z","0.3.0":"2026-06-03T17:31:39.449Z","0.6.0":"2026-06-04T16:37:47.857Z","0.6.1":"2026-06-04T18:13:23.252Z","0.6.7":"2026-06-12T07:45:36.858Z","0.6.8":"2026-06-21T14:48:41.303Z"},"bugs":{"url":"https://github.com/021is/brand-studio/issues"},"author":{"name":"edvone","url":"https://edvone.dev"},"license":"MIT","homepage":"https://github.com/021is/brand-studio#readme","keywords":["brand","design-system","material-design-3","md3","color-scheme","react","react-19","svg","framer-motion","design-tokens"],"repository":{"type":"git","url":"git+https://github.com/021is/brand-studio.git"},"description":"Generic MD3 brand-kit toolkit: seed → full light + dark role set, composable SVG shapes + motion + loading marks, mountable /brand page, mandatory icon + logo download-URL contract. Ships no brand content — every app supplies its own logo, i","maintainers":[{"name":"edvone","email":"edvard@edvone.dev"}],"readme":"

@021.is/brand-studio

\n\n

\n Generic MD3 brand toolkit for React.
\n Seed colour to a full light + dark Material Design 3 role set, composable SVG primitives, a mountable /brand page. Ships no brand content.\n

\n\n

\n \"npm\"\n \"downloads\"\n \"MIT\"\n \"bundle\n

\n\n---\n\n## Why\n\nBrand work in a React app usually splits between hand-authored hex palettes that drift across light + dark, hand-drawn marks that get pasted into every product, and a `/brand` page that nobody maintains. brand-studio replaces all three with one toolkit:\n\n- **Seed in, full scheme out.** One hex seed produces a contrast-correct MD3 role set for both light and dark via Google's `@material/material-color-utilities` (HCT).\n- **Composable SVG primitives.** `Squircle`, `Ring`, `Disc`, plus generic loading marks and motion helpers. Everything paints from `currentColor` or the MD3 vars the toolkit installs, so consumer-side theming is one line.\n- **A mountable `/brand` page.** Drop `` on a catch-all route and you get a live brand kit (overview · logo · colors · type · icons · motion · download) themed from your seed.\n- **Brand-content free.** No logos, no icon catalog, no hardcoded palette. Pass your own marks via `staticLogo` / `animatedLogo` / `icons`.\n\n## Install\n\n```bash\nbun add @021.is/brand-studio\n# or\nnpm install @021.is/brand-studio\n```\n\nPeers: `react ^19`, `react-dom ^19`, `framer-motion ^11 || ^12`.\n\n## Declare your brand\n\n```ts\n// brand.config.ts\nimport { defineBrand } from \"@021.is/brand-studio/define\";\n\nexport default defineBrand({\n name: \"Acme\",\n tagline: \"We make things.\",\n color: {\n seed: \"#3B82F6\", // required — the MD3 scheme derives from this\n tertiary: \"#22D3EE\", // optional accent\n // secondary, neutral, contrastLevel (-1..1), variant, overrides also supported\n },\n type: { sans: \"Inter\", mono: \"JetBrains Mono\" },\n voice: [\"Plain. Not corporate.\", \"Flat price. No surprises.\"],\n});\n```\n\n`defineBrand` eagerly resolves `config.scheme` (the full `{ light, dark }` role set) so downstream consumers never wait on a derivation.\n\n## Expose the download matrix (mandatory, v0.4+)\n\nEvery consumer ships a `/brand/download` link grid for the **app icon** and **logo** at **multiple sizes** in **both light and dark** variants. Wire `BrandConfig.downloads` with `buildStandardDownloads(basePath)` and serve the URLs from your host app:\n\n```ts\n// brand.config.ts\nimport { defineBrand, buildStandardDownloads } from \"@021.is/brand-studio/define\";\n\nexport default defineBrand({\n name: \"Acme\",\n // ... color, type, voice ...\n downloads: buildStandardDownloads({ basePath: \"/brand/download\" }),\n});\n```\n\nDefault URL shape: `///.`\nExample: `/brand/download/icon/256/light.svg` · `/brand/download/logo/64/dark.svg`\n\nCanonical matrix:\n- **Icon** sizes: 64 / 128 / 256 / 512 / 1024 (square edge px)\n- **Logo** sizes: 32 / 48 / 64 / 96 / 128 (height px)\n- Each size in both `light` and `dark`\n- Format: `svg` by default (PNG opt-in via the `formats` option)\n\nThe host app serves each URL — typically one Next.js route handler that renders the SVG mark sized + recoloured per the path params. Consumers that don't wire `downloads` keep working: the Download section falls back to the v0.3.x on-click SVG-blob generator, with a banner pointing at this section.\n\n## Mount the brand page\n\n```tsx\n// app/brand/[[...path]]/page.tsx\nimport config from \"@/../brand.config\";\nimport { BrandStudio } from \"@021.is/brand-studio\";\nimport { MyLogo, MyAnimatedMark } from \"@/brand/Logo\";\n\nexport default async function BrandPage({ params }: { params: Promise<{ path?: string[] }> }) {\n const { path = [] } = await params;\n return (\n }\n animatedLogo={}\n icons={[{ node: , label: \"glyph\" }]}\n />\n );\n}\n```\n\n`` injects the MD3 role set as `--md-*` CSS vars (light by default, dark under an ancestor `.dark`) and themes itself from them — contrast guaranteed in both modes without writing CSS.\n\n## Use the colour engine directly\n\n```ts\nimport { generateScheme, schemeToCssText } from \"@021.is/brand-studio/color\";\n\nconst scheme = generateScheme({ seed: \"#2EE5A8\", tertiary: \"#94B5F7\" });\n// scheme.light.primary, scheme.dark.onSurface, ...\n\nconst css = schemeToCssText(scheme);\n// \":root { --md-primary: ... } .dark { --md-primary: ... }\"\n```\n\nThe engine supports `secondary`, `tertiary`, `neutral`, `neutralVariant`, `error`, `contrastLevel` (`-1.0..1.0`), `variant` (`tonalSpot` / `vibrant` / `expressive` / `neutral` / `monochrome` / `fidelity` / `content`), and an `overrides` map for any role you want to pin literally.\n\n## Exports\n\n| Subpath | What's in it |\n| --- | --- |\n| `.` | Everything — `BrandStudio`, `defineBrand`, shapes, motion, loading marks |\n| `/color` | `generateScheme`, `schemeToCssText`, role types, contrast helpers |\n| `/shapes` | `Squircle`, `Ring`, `Disc` |\n| `/motion` | `Sweep`, `Drift`, `PulseLoop`, `RingDraw`, `Wobble`, `AppearGrow`, `Sequence`, `Strikethrough` |\n| `/loading` | `SpinnerLoadingMark`, `RingLoadingMark`, `PulseLoadingMark`, `LoadingMark` dispatcher |\n| `/app` | `` + sections (when you want them standalone) |\n| `/define` | `defineBrand`, `BrandConfig` type |\n\n## Philosophy\n\n- **Colour from a seed, not hand-picked hex.** Hex defaults invite drift. The MD3 engine derives the entire palette, and contrast is part of the contract.\n- **Each project owns its logo and icons.** Passed as `ReactNode` props.\n- **Zero commercial runtime deps.** Framer Motion (MIT) as peer; `@material/material-color-utilities` (Apache-2.0) bundled. No SaaS, no editor lock-in.\n- **SSR-safe and Tailwind-agnostic.** Inline styles + CSS vars; never a framework class name.\n\n## License\n\nMIT © [edvone](https://edvone.dev)\n","readmeFilename":"README.md"}