Flip

Active Seed DNA · Premiere

Premiere

Premium dark cinematic education with luxury weight

darkpremiumcinematic

Born From

The darkness before a film begins, that suspended moment when an audience goes quiet. Editorial red (#E32652) on black borrowed from a marquee sign outside a closed theater. The cinematic tradition of using light as revelation, not illumination. Inter at 500 in white on near-black, every sentence deliberate as a subtitle.

Acme
ProductsSolutionsPricing
#000000
Background
#272C33
Surface
#FFFFFF
Text
#9EA0A9
Muted
#E32652
Accent
#5B0F21
Soft
#FFFFFF
Border
#363B42
Hover

Why It Works

Pure black background (#000000) with dark surface (#272C33) creates cinematic depth. Red accent (#E32652) against black is theatrical and urgent, like a movie premiere. Heavy body weight (600) on light text makes every line of copy feel deliberate. Generous 20px radius softens the dark intensity into something inviting. Cinematic gradient fading from black creates the feeling of content emerging from darkness.

Best For

Premium online learning platforms with cinematic production value. Masterclass-style course marketplaces selling expertise as luxury. Celebrity and expert personal brand sites with dark luxury aesthetic. Subscription video platforms where the content feels like an event.

Skip This If

Your brand is educational and accessible. The dark luxury aesthetic creates an exclusivity barrier. You need readable long-form content. Heavy body weight (600) on dark backgrounds strains the eye. Your product is community-driven. The premium solo-viewing aesthetic fights collaborative energy.

Palette

Premiere starts in shadow.

Light finds its way through red.

Pure black (#000000) background with dark slate surface (#272C33). The surface is barely lighter than the background. Content panels are dark rectangles floating in the void. The deep red accent (#E32652) is the premium signal. Not bright red. Not maroon. A sophisticated rose-crimson that reads as "exclusive" and "passionate."

background#000000
surface#272C33
surface hover#363b42
text#FFFFFF
muted#9EA0A9
accent#E32652
accent soft#5b0f21
border#FFFFFF
Chart Palette
Status
Success
Warning
Error
Contrast
Text 21.0:1AAA
Accent 4.7:1AA

White text (#FFFFFF) on pure black creates maximum contrast. The muted text at #9EA0A9 is a warm silver that recedes gracefully on the dark canvas. White borders define containers with light, like gallery frames in a dark room.

The content is the event.

Your interface should feel like a curtain rising.

Premiere's pure black canvas turns every lesson, every video, every chapter into a performance worth paying for.

www.example.com
NOW IN BETA

The fastest way to
ship great products.

Turn your ideas into polished interfaces without burning weeks on design decisions.

Typography

Geist at 500.

Paired with Geist.

Inter at weight 500 for headings with positive letter-spacing (0.8px). That outward spacing is a luxury signal. Letters breathing apart instead of compressed together. It reads as relaxed confidence. The heading line-height at 0.85 (tighter than 1.0) means multi-line titles overlap slightly. Cinematic. Dramatic. Like movie poster credits.

Geist
mono: JetBrains Mono
Display49px
Heading 139px
Heading 231px
Heading 325px
Body16px
Caption13px
Weight: 500/600Heading spacing: 0.8pxBody spacing: 0.32pxHeading LH: 0.85Body LH: 1.5Base: 16pxScale: 1.25Para spacing: 16px

Body text at weight 600 (heavier than headings) with 1.5 line-height creates dense, readable paragraphs. The inverted weight hierarchy (heavier body than headings) puts emphasis on the content, not the labels. In a premium content platform, the lesson is the star. The titles are the theater marquee.

Reading in the dark never looked this good.

Cinema for your content.

Premiere's inverted weight hierarchy puts the spotlight on the content, letting every paragraph feel like it's being projected for you alone.

NEW RELEASE

Build something
people remember.

Design tokens that give your product a point of view. Not just colors and fonts. Personality.

Shape

Rounded radius. 1px borders.

Premiere's physical language.

Twenty-pixel radius. Generous and soft against the hard dark background. That contrast between the angular darkness and the rounded containers creates visual tension. The cinematic gradient (linear-gradient fading from black) creates dramatic lighting effects. Content emerges from darkness. Sections fade into shadow. The shape language is theatrical.

Card heading
Body text showing how the seed's typography feels inside a real component.
Tag
Hover to feel the interaction
XL Radius
24px
shadowLg
Radius:20px
Radius SM:4px
Radius XL:24px
Border:1px solid
Shadow:none
Hover:scale
Focus:ring
Active scale:0.97
Density:comfortable
Divider:space

Luxury fits a 375-pixel screen.

The stage follows you.

Premiere's cinematic design scales to a phone without losing the dark theater feel that makes content feel exclusive.

Design faster.
Ship smarter.

Production-ready tokens for every project.

No credit card required
2,847 users
Atmosphere

Smooth and comfortable.

Premiere's invisible layer.

No shadows. On a black background, shadows have nowhere to go. Depth comes from the surface color stepping and the gradient treatment. The scale hover effect creates subtle size changes on interaction. Not lift. Scale. Elements grow slightly larger when you engage with them, like zooming into a frame. The smooth motion speed keeps everything feeling deliberate and considered. Nothing in Premiere happens fast. Every transition is a slow reveal.

Speed: smoothEasing: ease, easeEasing In: cubic-bezier(0.22, 1, 0.36, 1)Easing Out: cubic-bezier(0.55, 0, 1, 0.45)Blur: 0pxNoise: noneOpacity: 1
Home
Settings
User
Search
Bell
Mail
Star
Heart
Icons: outlined / 20px
Density: comfortableGrid: 12 cols / 24px gapContainer: 1280pxSection: 64px / Content: 48pxSpace unit: 8px

Go build something beautiful.

111 design decisions that all agree with each other. Made for you to use in an instant.

Start Building

SAAS LANDING PAGE · 1440

S
Shipwreck.
PlatformSolutionsDocumentationPricing
Sign In
237 deploys today. Join the elite.

Stop deploying like it’s 2019.

Shipwreck turns your git push into a production deploy in 11 seconds. Zero config, infinite scale, and an interface that doesn’t look like a spreadsheet.

Trusted by teams at

StripeVercelLinearRetoolSupabaseGitHubStripeVercelLinearRetoolSupabaseGitHub
11s
Avg. Deploy Time.
99.99%
Uptime Guarantee.
0
YAML Files Touched.

Everything you need.

Push and pray.
We handle the "pray" part. Instant detection of your framework, automatic optimization, and edge deployment.
Env variables.
Secure secrets management that actually makes sense. Sync across environments without copying .env files ever again.
Logs.
Real-time streaming logs with zero latency. Filter, search, and debug faster than you can type 'console.log'.

From code to edge.

01

Connect Repository

Link your GitHub, GitLab, or Bitbucket in two clicks. We scan your tech stack instantly.

02

Automated Build

Our high-speed runners build your app in isolated containers. No cold starts, just speed.

03

Global Propagation

Your app is pushed to 300+ edge locations globally. Sub-10ms latency for every user.

$ git push origin main
Initializing shipwreck build pipeline...
Detecting Framework: Next.js 14
Installing dependencies... [1.2s]
Running production build... [4.5s]
✓ Build successful
Optimizing assets for Edge... [0.8s]
Deploying to 312 nodes...
🚀 Production live: https://shipwreck.sh/v1-final

Observe everything.

A dashboard built for developers who hate dashboards. No fluff, just the metrics that matter for your application health.

  • Automatic SSL Management
  • Preview Deployments on every PR
  • Infinite Scalability Engine
SHIPWRECK CONSOLE / ANALYTICS
Latency
8ms
Success Rate
100%
Traffic
12.4k/s
[12:44:01]GET/api/v1/user/auth - 200 OK (12ms)
[12:44:02]POST/api/webhooks/stripe - 202 Accepted
[12:44:05]GET/static/images/hero.webp - 304 Not Modified

Don't take our word for it. Take theirs.

“

Shipwreck is the first platform that actually stays out of my way. It feels like I’m writing code directly to the browser.

JD
Josh Doe
CTO at Hyperdrive
“

The speed is actually offensive. I push a commit and before I can switch tabs, the preview link is already in Slack.

SK
Sarah Klein
Lead Engineer at Void
“

We migrated 400 microservices in a weekend. Our dev team might actually like me now. Highly recommended.

ML
Marcus Lee
SVP Eng at BigCo

Pricing that scales.

Start for free, grow until you’re a unicorn.

Hobby

$0/mo
  • 3 Projects
  • Global Edge Network
  • SLA Guarantee
Most Popular

Team

$29/mo
  • Unlimited Projects
  • Priority Support
  • 99.9% SLA

Common questions.

Absolutely not. We run our own bare-metal orchestration layer built specifically for high-frequency deployments. While we leverage cloud partners for edge nodes, the core engine is pure Shipwreck engineering.

Your Friday deploys deserve better.

11-second deploys. Automatic rollbacks. Zero YAML. Start free, no credit card.

Shipwreck.

High-performance deployment infrastructure for teams that refuse to slow down. Built by developers, for developers.

Product
FeaturesChangelogStatus
Resources
DocumentationAPI ReferenceCommunity
Company
AboutSecurityCareers
© 2024 Shipwreck. Engineering Elegance.
TermsPrivacySecurity

SAAS LANDING PAGE · 768

S
Shipwreck.
PlatformSolutionsDocumentation
237 deploys today. Join the elite.

Stop deploying like it’s 2019.

Shipwreck turns your git push into a production deploy in 11 seconds. Zero config, infinite scale, and an interface that doesn’t look like a spreadsheet.

Trusted by teams at

StripeVercelLinearRetoolSupabaseGitHubStripeVercelLinearRetoolSupabaseGitHub
11s
Avg. Deploy Time.
99.99%
Uptime Guarantee.
0
YAML Files Touched.

Everything you need.

Push and pray.
We handle the "pray" part. Instant detection of your framework, automatic optimization, and edge deployment.
Env variables.
Secure secrets management that actually makes sense. Sync across environments without copying .env files ever again.
Logs.
Real-time streaming logs with zero latency. Filter, search, and debug faster than you can type 'console.log'.

From code to edge.

01

Connect Repository

Link your GitHub, GitLab, or Bitbucket in two clicks. We scan your tech stack instantly.

02

Automated Build

Our high-speed runners build your app in isolated containers. No cold starts, just speed.

03

Global Propagation

Your app is pushed to 300+ edge locations globally. Sub-10ms latency for every user.

$ git push origin main
Initializing shipwreck build pipeline...
Detecting Framework: Next.js 14
Installing dependencies... [1.2s]
Running production build... [4.5s]
✓ Build successful
Optimizing assets for Edge... [0.8s]
Deploying to 312 nodes...
🚀 Production live: https://shipwreck.sh/v1-final

Observe everything.

A dashboard built for developers who hate dashboards. No fluff, just the metrics that matter for your application health.

  • Automatic SSL Management
  • Preview Deployments on every PR
  • Infinite Scalability Engine
SHIPWRECK CONSOLE / ANALYTICS
Latency
8ms
Success Rate
100%
Traffic
12.4k/s
[12:44:01]GET/api/v1/user/auth - 200 OK (12ms)
[12:44:02]POST/api/webhooks/stripe - 202 Accepted
[12:44:05]GET/static/images/hero.webp - 304 Not Modified

Don't take our word for it. Take theirs.

“

Shipwreck is the first platform that actually stays out of my way. It feels like I’m writing code directly to the browser.

JD
Josh Doe
CTO at Hyperdrive
“

The speed is actually offensive. I push a commit and before I can switch tabs, the preview link is already in Slack.

SK
Sarah Klein
Lead Engineer at Void
“

We migrated 400 microservices in a weekend. Our dev team might actually like me now. Highly recommended.

ML
Marcus Lee
SVP Eng at BigCo

Pricing that scales.

Start for free, grow until you’re a unicorn.

Hobby

$0/mo
  • 3 Projects
  • Global Edge Network
  • SLA Guarantee
Most Popular

Team

$29/mo
  • Unlimited Projects
  • Priority Support
  • 99.9% SLA

Common questions.

Absolutely not. We run our own bare-metal orchestration layer built specifically for high-frequency deployments. While we leverage cloud partners for edge nodes, the core engine is pure Shipwreck engineering.

Your Friday deploys deserve better.

11-second deploys. Automatic rollbacks. Zero YAML. Start free, no credit card.

Shipwreck.

High-performance deployment infrastructure for teams that refuse to slow down. Built by developers, for developers.

Product
FeaturesChangelogStatus
Resources
DocumentationAPI ReferenceCommunity
Company
AboutSecurityCareers
© 2024 Shipwreck. Engineering Elegance.
TermsPrivacySecurity

SAAS LANDING PAGE · 375

S
237 deploys today. Join the elite.

Stop deploying like it’s 2019.

Shipwreck turns your git push into a production deploy in 11 seconds. Zero config, infinite scale, and an interface that doesn’t look like a spreadsheet.

Trusted by teams at

StripeVercelLinearRetoolSupabaseGitHubStripeVercelLinearRetoolSupabaseGitHub
11s
Avg. Deploy Time.
99.99%
Uptime Guarantee.
0
YAML Files Touched.

Everything you need.

Push and pray.
We handle the "pray" part. Instant detection of your framework, automatic optimization, and edge deployment.
Env variables.
Secure secrets management that actually makes sense. Sync across environments without copying .env files ever again.
Logs.
Real-time streaming logs with zero latency. Filter, search, and debug faster than you can type 'console.log'.

From code to edge.

01

Connect Repository

Link your GitHub, GitLab, or Bitbucket in two clicks. We scan your tech stack instantly.

02

Automated Build

Our high-speed runners build your app in isolated containers. No cold starts, just speed.

03

Global Propagation

Your app is pushed to 300+ edge locations globally. Sub-10ms latency for every user.

$ git push origin main
Initializing shipwreck build pipeline...
Detecting Framework: Next.js 14
Installing dependencies... [1.2s]
Running production build... [4.5s]
✓ Build successful
Optimizing assets for Edge... [0.8s]
Deploying to 312 nodes...
🚀 Production live: https://shipwreck.sh/v1-final

Observe everything.

A dashboard built for developers who hate dashboards. No fluff, just the metrics that matter for your application health.

  • Automatic SSL Management
  • Preview Deployments on every PR
  • Infinite Scalability Engine
SHIPWRECK CONSOLE / ANALYTICS
Latency
8ms
Success Rate
100%
Traffic
12.4k/s
[12:44:01]GET/api/v1/user/auth - 200 OK (12ms)
[12:44:02]POST/api/webhooks/stripe - 202 Accepted
[12:44:05]GET/static/images/hero.webp - 304 Not Modified

Don't take our word for it. Take theirs.

“

Shipwreck is the first platform that actually stays out of my way. It feels like I’m writing code directly to the browser.

JD
Josh Doe
CTO at Hyperdrive
“

The speed is actually offensive. I push a commit and before I can switch tabs, the preview link is already in Slack.

SK
Sarah Klein
Lead Engineer at Void
“

We migrated 400 microservices in a weekend. Our dev team might actually like me now. Highly recommended.

ML
Marcus Lee
SVP Eng at BigCo

Pricing that scales.

Start for free, grow until you’re a unicorn.

Hobby

$0/mo
  • 3 Projects
  • Global Edge Network
  • SLA Guarantee
Most Popular

Team

$29/mo
  • Unlimited Projects
  • Priority Support
  • 99.9% SLA

Common questions.

Absolutely not. We run our own bare-metal orchestration layer built specifically for high-frequency deployments. While we leverage cloud partners for edge nodes, the core engine is pure Shipwreck engineering.

Your Friday deploys deserve better.

11-second deploys. Automatic rollbacks. Zero YAML. Start free, no credit card.

Shipwreck.

High-performance deployment infrastructure for teams that refuse to slow down. Built by developers, for developers.

Product
FeaturesChangelogStatus
Resources
DocumentationAPI ReferenceCommunity
Company
AboutSecurityCareers
© 2024 Shipwreck. Engineering Elegance.
TermsPrivacySecurity
50%