Open a brand portal
const url = 'http://localhost:3000/api/v1/portal/example?limit=60&offset=0';const options = {method: 'GET'};
try { const response = await fetch(url, options); const data = await response.json(); console.log(data);} catch (error) { console.error(error);}curl --request GET \ --url 'http://localhost:3000/api/v1/portal/example?limit=60&offset=0'What a visitor sees: the portal, themed, its collections with how many usable assets each has, its brands, and a page of them with their downloads. URLs are relative to the host asked, so a portal on its own domain loads from there. A password goes in X-Portal-Password, an approved request’s key in X-Portal-Key; a members portal reads the session. 401 password names how to get in (see PortalGate), 410 gone once closed.
No key needed.
Parameters
Section titled “Parameters”Path Parameters
Section titled “Path Parameters”The portal’s address
Query Parameters
Section titled “Query Parameters”Every word must match, each as a prefix
Only this one of its collections
Page size
Skip this many
Responses
Section titled “Responses”The portal’s contents
object
object
object
A URL on this host: the portal’s, else its first brand’s mark, else its organization’s
The portal’s, else its first brand’s color, else its organization’s
The organization’s, for the browser tab
What the organization calls the product
object
Up to 3 of its newest pictures’ thumbnails, URLs on this host
Footer, quick grab and terms, as its pages have them
object
object
Markdown
object
A URL or mailto:
Quick grab: pinned links in the header
object
With page: a brand the portal carries; the first when left out
Markdown readers accept once before their first download
Search engines may index it; public portals only
How to draw it: its first brand’s site; with no brand, the portal’s accent over the app’s own
object
Derived and graded, as a page view’s
object
The accent, lifted for light and dark pages, and the faces, as before W3
object
A hex color
A hex color
A hex color
A hex color
A hex color
A hex color
The fill, as the brand has it: bands and buttons
The accent where it is text (links), at 4.5:1 on the surface
A hex color
A hex color
object
object
The font file for its weight
Every font file of the rule, one @font-face each
object
From Google Fonts, with no files here yet: set in its fallback until they are imported
object
The font file for its weight
Every font file of the rule, one @font-face each
object
From Google Fonts, with no files here yet: set in its fallback until they are imported
object
The font file for its weight
Every font file of the rule, one @font-face each
object
From Google Fonts, with no files here yet: set in its fallback until they are imported
In em
Header is band
On this page: a side column, a list under the page header, or none
Contrast of each pair in the look: one that fails falls back to a color that reads, and says which
object
Which color on which, e.g. ink on surface
The contrast it must reach: 4.5 for text, 3 for marks
The color used: fg when it passes, else its fallback
object
Hairline: the accent draws rules and marks, never fills
Corner radius in px
Heading size ratio; 1.25 when left out
Every page opens on a band of the brand color; header band says the same
A page’s opening: on the page, on a band of the brand color, or beside its cover
Between two sections on the page’s own ground: space alone, or a hairline too
Number chapters and pages: 01, 01.2
Subtle: sections reveal as they scroll in; never with reduced motion
On this page: a side column, a list under the page header, or hidden
Section titles: headings (medium), or headlines (large, huge); a section’s own size wins
Alternate: every other section on the page’s own ground sits on the panel, so a long page has rhythm; canvas: under its header the page sits on the panel, dotted like a whiteboard, its section titles centered
The languages readers pick from; the first is the one the pages are written in
object
From the language when left out
Links beside search and print on the brand’s pages: its repository, its Figma library, its site
object
Http or https; a link to GitHub, Figma, npm and the like shows its icon
Signatures for the theme’s font files and device
object
Its pages carry “Powered by Artbucket”: a public portal whose organization’s plan has no white-label
object
A URL on this host
Larger, for a closer look
object
Example
{ "portal": { "access": "public", "look": { "theme": { "accentUse": "fill", "faces": { "head": { "google": true }, "body": { "google": true }, "label": { "google": true } }, "width": "narrow", "density": "compact", "nav": "sidebar", "header": "plain", "separation": "space", "motion": "none", "toc": "side", "settings": { "accentUse": "fill", "width": "narrow", "density": "compact", "nav": "sidebar", "header": "plain", "separation": "space", "motion": "none", "toc": "side", "titles": "medium", "grounds": "plain", "languages": [ { "dir": "ltr" } ] } } } }, "data": [ { "downloads": [ { "preset": "web" } ] } ]}Not in yet: how to get in
object
object
object
object
A URL on this host: the portal’s, else its first brand’s mark, else its organization’s
The portal’s, else its first brand’s color, else its organization’s
The organization’s, for the browser tab
What the organization calls the product
Example
{ "error": { "code": "password", "detail": { "access": "password" } }}default
Section titled “default”An error
object
object
Examplegenerated
{ "error": { "code": "example", "message": "example", "detail": "example" }}