← Back Style Guide

Style Guide

Visual reference for judasellis.com

Color Palette

Pink (BG)
#f2b8c6
White
#ffffff
Black
#000000
Paper
#faf6f0
Warm Pink
#ff6d9e
Dark Berry
#3d1028
Near Black
#1a0a10

Typography

Bowlby One SC — Display 18vw / Cover
Judas Ellis
Bowlby One SC — Heading 11–14vw / Pages
Portfolio
JetBrains Mono — Body 0.85rem / 1.7

Work coming soon. Stay tuned for selected projects, visual experiments, and creative direction.

JetBrains Mono — Caption / UI 0.7rem / 900
Coming Soon  ·  Sign Up  ·  © 2026

Cursor-Reactive Text Effect

Move Your Cursor

Paper texture (fine + coarse grain) + radial gradient, clipped to text

Components

Email Signup Form

Hamburger Icon

Divider (1px solid #000)

Subtext Box (Paper Texture)

Coming Soon

Contact Card

Judas Ellis
judasellis.com
Save Contact

Business Card Icon (Footer)

Business Card

Business Card Modal (Glass Effect)

Judas Ellis
Stage Manager / Lighting Designer
therealjudahel@gmail.com ellis_judah@students.columbusstate.edu (706) 617-9908
judasellis.com

Paper / Cardstock Texture

Applied to white elements — fine grain + coarse fiber over #f8f4ee

Portfolio Show Card

Show Name
2025 Stage Manager

Developer Menu (Password-Gated)

Developer Style Guide

Page Structure

Header (Fixed)
Page 1 — Cover (Center)
Page 2 — Portfolio (Left)
Page 3 — Productions (Right)
Page 4 — Contact (Center)
Footer (Anchored) + Card Icon

Spacing

2rem — Page padding
1.5rem — Header / Footer
1rem — Content gap
4px — Hamburger gap