/ docs

Versions

v1/ v2/ v3/ v4/all.min.css v4/base.css v4/tokens.css v4/tokens.json v4/theme.js

Usage

<link rel="stylesheet" href="https://style.illanes00.cl/v4/all.min.css">
<script src="https://style.illanes00.cl/v4/theme.js" defer></script>

Color Tokens

Base

--bg

#f6f7f8

--paper

#ffffff

--ink

#0f1113

--muted

#4b5563

Borders

--line

#d5dbe3

--line-strong

#a9b3c2

Grays

--c-grey

#616e7c

--c-grey-dark

#3a424d

--c-charcoal

#111314

--c-silver

#cfd6de

Semantic

--c-green

#0b7e59

--c-blue

#3763e0

--c-amber

#d97706

--c-red

#c0352b

Typography

Heading 1 — IBM Plex Sans 800

Heading 2 — IBM Plex Sans 800

Heading 3 — IBM Plex Sans 700

Heading 4 — IBM Plex Sans 700

Heading 5 — IBM Plex Sans 600

Heading 6 — IBM Plex Sans 600

Body text at --fs-base (16px) with line-height 1.62. This is bold text, this is italic text, and this is a link.

Small text at --fs-sm (13px) for secondary content.

Scale

Token	Size	Sample
`--fs-xs`	0.75rem (12px)	Extra small text
`--fs-sm`	0.8125rem (13px)	Small text
`--fs-base`	1rem (16px)	Base text
`--fs-lg`	1.125rem (18px)	Large text
`--fs-xl`	1.25rem (20px)	Extra large text
`--fs-2xl`	1.5rem (24px)	2XL text
`--fs-3xl`	1.875rem (30px)	3XL text

Code

Inline code with JetBrains Mono.

// Code block
const greeting = 'hello, illanes00';
console.log(greeting);

Spacing

--space-1

4px

--space-2

8px

--space-3

12px

--space-4

16px

--space-6

24px

--space-8

32px

--space-12

48px

--space-16

64px

Buttons

Cards

Card Title

Card body content with a link. Cards use --paper background and --line borders.

Card footer

Compact Card

With reduced padding via .card-compact.

Tables

Service	VPS	Port	Status
illanes00-admin	vps-dev	`8101`	OK
illanes00-monitor	vps-control	`5100`	OK
illanes00-api	vps-deploy	`5000`	DEGRADED
illanes00-backup	vps-deploy	`5001`	DOWN

Forms

Service Name

Lowercase, hyphens only.

VPS

Notes

Enable monitoring

Alerts

Success: Service deployed successfully.

Info: New version available for illanes00-monitor.

Warning: SSL certificate expires in 7 days.

Error: Connection to vps-deploy failed.

Badges & Pills

Pills (Status)

OK INFO WARNING ERROR DEFAULT

Dots (Indicators)

Running Deploying Degraded Down

VPS Badges

vps-dev vps-control vps-deploy default