Blue Laser Clean Glass Layout vs CSS Border Gradient

Meng To · Meng To

Tied at 3/5 on the same brief. Pick by fit: the rows below show where each one is stronger.

Both built the Tally landing page in the same Claude Code test, and both design the Night Shift way: dark screens, glowing accents, work that looks best at 2am. Both are best for: visual direction, dashboards.

Blue Laser Clean Glass Layout3/5
After: Tally landing page, made with Blue Laser Clean Glass Layout (Meng To)
CSS Border Gradient3/5
After: Tally landing page, made with CSS Border Gradient (Meng To)

Scroll either page; the other follows.

Blue Laser Clean Glass Layout (Meng To)

3/5

Blue Laser Clean Glass Layout puts Tally on near-black with a thin blue light beam, frosted glass panels and Inter Tight with mono labels. The dashboard is the stronger page: clear cards, blue bars and readable tables. The mobile dashboard scrolls sideways. Pick it for technical or premium dark products.

CSS Border Gradient (Meng To)

3/5

CSS Border Gradient takes Tally dark: deep navy panels with faint mint-edged gradient borders, Fraunces headlines over Manrope on the landing and Inter on the dashboard, with mint, amber and coral accents. The dashboard is clean and colorful without getting loud. Pick it if you want a polished dark product with a soft glow.

Side by side

FieldBlue Laser Clean Glass Layout (Meng To)CSS Border Gradient (Meng To)
Fonts
  • Inter Tight (landing)
  • Inter
  • JetBrains Mono
  • Fraunces (landing)
  • Manrope (landing)
  • Inter (dashboard)
  • JetBrains Mono (dashboard)
Colors
  • #04060c near-black
  • #3d6bff blue
  • #7cc4ff cyan
  • #f4f7ff text
  • #8d97b3 muted
  • #4ee0a8 green
  • #ffb35c amber
  • #0a0f17 navy black
  • #121a26 panel
  • #6ee7b7 mint
  • #5eead4 teal (dashboard)
  • #f5c176 amber
  • #f2917b coral
  • #e9eef4 text
Pick it for
  • dark-mode SaaS
  • developer and AI tools
  • fintech dashboards
  • product launch pages
  • dark-mode SaaS
  • fintech dashboards
  • premium app sites
  • developer tools
Skip it for
  • warm consumer brands
  • light-mode products
  • print-like editorial sites
  • light-mode brands
  • print-like editorial sites
  • playful consumer apps
Observations
  • dashboard mobile: 469 px wide on a 390 px screen, so it scrolls sideways
  • familiar dark-blue SaaS look, close to several other dark skills in this set
  • the serif-plus-green headline style still echoes the default, only in the dark
  • the gradient borders are subtle enough to disappear on dim screens

How the brief works

Install Blue Laser Clean Glass Layout (Meng To)

1 Run in your terminal

npx degit MengTo/Skills/agent-skills/web-design/blue-laser-clean-glass-layout#main .claude/skills/blue-laser-clean-glass-layout

2 Or paste a prompt into Claude Code, Codex, Cursor or Gemini

It tells your tool to install this from its source repository.

This install is for Claude Code only; for other agents use Copy prompt or copy the skill folder.

Copies just this skill's folder into your project's .claude/skills.

Check the source for the latest instructions.

Install CSS Border Gradient (Meng To)

1 Run in your terminal

npx degit MengTo/Skills/agent-skills/web-design/css-border-gradient#main .claude/skills/css-border-gradient

2 Or paste a prompt into Claude Code, Codex, Cursor or Gemini

It tells your tool to install this from its source repository.

This install is for Claude Code only; for other agents use Copy prompt or copy the skill folder.

Copies just this skill's folder into your project's .claude/skills.

Check the source for the latest instructions.