The Pavilion. IPL 2026 in your team's colours. Standings, fixtures, squads, and a pass made for Instagram.

Client

The Pavilion

Year

2026

Scope of Work

Vanilla JS
Cloudflare Workers
GitHub Actions Cron
cricapi
Wikipedia Scraper
Canvas 2D Pass
PWA
Editorial Design System

The Pavilion is a personal IPL 2026 dashboard. You pick a team on the way in and the whole thing floods in its colours: a countdown to your next match, a live scorecard when your team is on the field, the points table with your row lit, all 74 fixtures, squads, and four dressing-room stories per team. It went live on 22 April 2026, a day after the first line of code, with a custom domain the day after that.

The brief

The look is Wisden almanac typography on cream paper inside a black broadcast sandwich, with the team colours doing the work. Vanilla HTML, CSS and ES modules, no framework, and no backend for anything personal: your name and team never leave your browser. Standings, fixtures, caps and squads refresh on a cron, and the site ran itself for the last ten days of the season.

The Pavilion Pass is what made it travel: a 1080 by 1920 story drawn on a canvas in the browser, with a share link that pre-selects your team for the friend who opens it. It carried the dashboard to 90,000-plus Instagram views during the season and became the formula Fan Park was built on. The detail is in the screens below.

One thing I'd do differently: wire the live data feed before the first matchday, not on day 25. The static snapshot with a daily refresh held up, but a fan refreshing during a chase deserves the live wire from ball one.

Every pass is stamped to a name.

Onboarding asks two things: your name and your team. The name goes on the ticket, the footer and the whole dashboard. Nothing is sent anywhere; it lives in your browser. The promise printed in the credits: your name and team never leave your browser, no account, no server, nothing.

Who do you live and die for? Ten jerseys, one choice.

Pick a team and the dashboard floods in its colours, derived from the primary and secondary with color-mix so the washes and glows stay on-brand. A referral link with a team code pre-selects the tile for the friend who receives it, which is how the pass travelled on Instagram.

Editorial cream paper inside a black broadcast sandwich.

The design rule: Wisden almanac typography for the editorial layer, IPL broadcast graphics for the team-colour blocks, a personal issue of a magazine for the framing. Five typefaces with strict roles: Bebas Neue for names, Instrument Serif italic only for ceremonial lines like the chant, Inter for UI, JetBrains Mono for numbers. Vanilla HTML, CSS and ES modules. No framework, no build step.

The mast is a ticket, notches and all.

Ticket-edge notches, a crest strip with season and serial, the massive name, the italic chant, and the Season Dossier plate on the right with position, points, matches and form. A perforated divider and a dateline with the data-status pill underneath. Download Pass is the primary action on every viewport.

The points table with your row lit up.

Standings refreshed by a daily GitHub Actions scrape, later wired to a Wikipedia scraper on the Pit Wall worker with a 30-minute KV cache and the static snapshot as fallback. QUALIFIED and ELIMINATED chips arrive on their own as the maths locks. The site ran itself for the last ten days of the season.

Orange Cap and Purple Cap, top five, refreshed every day.

Most runs and most wickets in the season, with the team badge and the number set in mono. Same cron as the table, so the caps never lag the standings they sit beside.

All 74 fixtures, filtered to your team, results in one column.

Fixtures pulled through cricapi on a daily cron, with the venue and result on every row. A live scorecard appears above the schedule when your team is on the field, polling every 60 seconds during play.

Pavilion Intel: four dressing-room stories per team.

Hand-written storylines, dated, kept honest by a staleness check that flags any story past its shelf life, so a stale line never sits on a live dashboard. The feeds carry the numbers; the intel carries the reasons to care, written by a fan who watched every ball.

The squad, every player with a role and a jersey number.

Twenty-six names in a grid: batter, bowler, all-rounder, keeper, with the jersey number set large in the corner of each card. Squads auto-refresh, so a mid-season signing shows up without a deploy.

The Pavilion Pass, a 1080 by 1920 story for Instagram.

Drawn on a Canvas 2D in the browser: your name, serial, avatar, team colours and the season line. Add a photo, download, share, or copy a link that pre-selects your team for whoever opens it. A batch export saves passes for all ten teams in one ZIP. Live 22 April 2026, custom domain the next day; the pass is what carried it to 90,000-plus Instagram views during the season.

Performance
Lighthouse
Mobile
0/100
Great
Desktop
0/100
Excellent
Core Web VitalsMobileDesktop
LCPLargest Contentful Paint
2.1 s0.9 s
FCPFirst Contentful Paint
1.6 s0.6 s
TBTTotal Blocking Time
120 ms10 ms
CLSCumulative Layout Shift
0.020.00

Trusted by many

Trusted by many

150+ Happy clients

Like what you see?
Book a free discovery call.

150+ Happy clients

Like what you see?
Book a free discovery call.

Create a free website with Framer, the website builder loved by startups, designers and agencies.