Skip to content
SwiftJobs

Show pay in

Converted amounts are approximate and marked with ~.

ID
SwiftJobs
See open roles

Customization

Change the brand, colors, type, copy and languages.

Name and contact details

Edit SITE in src/config/site.ts: the site name, the three contact emails and the palette.

Set your production domain as site in astro.config.mjs. It is used for canonical URLs, hreflang, the sitemap, feeds, Open Graph images and JSON-LD.

Colors

SwiftJobs uses one accent color. Pick a preset in src/config/site.ts:

palette: 'signal', // 'signal' | 'cobalt' | 'volt'

Each preset is checked against WCAG AA in light and dark mode. To create your own, copy a preset block in src/styles/global.css and change --sj-accent, --sj-on-accent (text on the accent) and --sj-accent-ink (accent-colored text). Check contrast before you ship: text needs 4.5:1.

The neutral colors (--sj-bg, --sj-ink and friends) are defined once for light and once for dark mode in the same file. Components never use raw hex values, so changing a token changes the whole site.

Social images are rendered at build time and use OG_COLORS in src/lib/og.tsx. Update those too when you rebrand.

Fonts

Fonts are self-hosted through Fontsource:

  • Bricolage Grotesque for headings
  • Geist for text
  • Geist Mono for numbers and pay

To change them, install another Fontsource package, update the imports at the top of src/styles/global.css, and change --font-display, --font-sans and --font-mono.

Copy and languages

Every visible string lives in src/i18n/ui.ts, once for English (en) and once for Indonesian (id). TypeScript checks that both languages have every key.

To add a language:

  1. Copy the en object in src/i18n/ui.ts, translate it and add it to ui.
  2. Register it in LOCALES in src/i18n/index.ts.
  3. Add it to i18n.locales in astro.config.mjs.
  4. Copy src/pages/id/ to src/pages/<code>/.

Job descriptions and company profiles are not translated. They are written by employers.

Photos

The demo uses placeholder photos from Picsum. Replace the cover URLs in src/content/companies/companies.json and the two images in src/views/HomeView.astro. Put your own photos in public/images/ and use paths like /images/office.jpg.

Every photo gets the signature duotone treatment automatically.

SwiftJobs theme demo

Everything here ships in the theme. This panel does not.

Made by

Accent preset
Site mode