Colorado Ski Trip Gear Cost Calculator

:root {
–ink: #101820;
–muted: #5c6b73;
–line: #d9e3e8;
–snow: #f7fbfd;
–ice: #e9f5fb;
–blue: #0b72b9;
–green: #16865a;
–orange: #c65b15;
–white: #fff;
}
* { box-sizing: border-box; }
body {
margin: 0;
font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, “Segoe UI”, sans-serif;
color: var(–ink);
background: linear-gradient(180deg, var(–snow), #fff 340px);
line-height: 1.5;
}
.wrap {
width: min(1120px, calc(100% – 32px));
margin: 0 auto;
padding: 34px 0 48px;
}
header {
display: grid;
grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
gap: 24px;
align-items: stretch;
margin-bottom: 22px;
}
h1, .sx-calc-display-title {
margin: 0 0 12px;
font-size: clamp(2rem, 4vw, 4rem);
line-height: .95;
letter-spacing: 0;
}
.lead {
max-width: 720px;
margin: 0;
color: var(–muted);
font-size: 1.05rem;
}
.hero-panel, .panel, .results {
border: 1px solid var(–line);
background: rgba(255,255,255,.92);
border-radius: 8px;
box-shadow: 0 18px 48px rgba(17, 49, 73, .08);
}
.hero-panel {
padding: 20px;
display: grid;
gap: 14px;
align-content: center;
}
.hero-stat {
display: grid;
grid-template-columns: 44px 1fr;
gap: 12px;
align-items: center;
}
.icon {
width: 44px;
height: 44px;
border-radius: 8px;
display: grid;
place-items: center;
background: var(–ice);
color: var(–blue);
font-weight: 800;
}
.hero-stat strong { display: block; }
.hero-stat span { color: var(–muted); font-size: .92rem; }
.grid {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(320px, .72fr);
gap: 22px;
align-items: start;
}
.panel { padding: 20px; }
.panel h2, .results h2 {
margin: 0 0 14px;
font-size: 1.2rem;
}
.fields {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 14px;
}
label {
display: grid;
gap: 6px;
font-weight: 700;
font-size: .92rem;
}
input, select {
width: 100%;
min-height: 42px;
border: 1px solid var(–line);
border-radius: 6px;
padding: 8px 10px;
font: inherit;
background: #fff;
color: var(–ink);
}
.wide { grid-column: 1 / -1; }
.results {
position: sticky;
top: 16px;
padding: 20px;
}
.total {
padding: 18px;
border-radius: 8px;
background: var(–ink);
color: #fff;
margin-bottom: 14px;
}
.total span {
display: block;
font-size: .82rem;
color: rgba(255,255,255,.72);
text-transform: uppercase;
letter-spacing: .08em;
}
.total strong {
display: block;
font-size: clamp(2rem, 5vw, 3.2rem);
line-height: 1;
margin-top: 6px;
}
.rows { display: grid; gap: 8px; }
.row {
display: flex;
justify-content: space-between;
gap: 14px;
border-bottom: 1px solid var(–line);
padding: 8px 0;
}
.row:last-child { border-bottom: 0; }
.row span:first-child { color: var(–muted); }
.row strong { text-align: right; }
.note {
margin-top: 14px;
padding: 12px;
border-radius: 8px;
background: #fff7ed;
color: #7a3412;
font-size: .92rem;
border: 1px solid #fed7aa;
}
.buy-list {
margin-top: 18px;
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 12px;
}
.buy-item {
border: 1px solid var(–line);
border-radius: 8px;
background: #fff;
padding: 14px;
}
.buy-item strong { display: block; margin-bottom: 4px; }
.buy-item span { color: var(–muted); font-size: .9rem; }
.disclosure {
margin-top: 20px;
color: var(–muted);
font-size: .86rem;
}
@media (max-width: 820px) {
header, .grid { grid-template-columns: 1fr; }
.results { position: static; }
.buy-list { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
.wrap { width: min(100% – 22px, 1120px); padding-top: 22px; }
.fields { grid-template-columns: 1fr; }
h1, .sx-calc-display-title { font-size: 2.25rem; }
}

Colorado Ski Trip Gear Cost Calculator

Estimate what a first Colorado ski-area visit could cost when you factor in rentals, beginner gear purchases, lift tickets, lessons, parking, meals, and lodging. Use the result to decide what to rent, what to buy, and what can wait.

Trip Details

Ski gogglesFit, lens condition, fog control, and comfort are personal. Goggles are reusable across trips.
Ski helmetBuy only if it fits well and meets relevant snow-sport certification. Fit matters more than price alone.
Ski glovesWarm, dry hands can make or break a first trip. Mittens may be better for very cold days and kids.

Estimates are planning ranges only. Prices vary by resort, season, age, rental shop, ticket timing, lodging market, and product availability. SkiShopX may earn from qualifying affiliate purchases. Always verify final prices and helmet fit/certification before buying.

const ids = [“adults”,”kids”,”days”,”nights”,”adultRental”,”kidRental”,”adultLift”,”kidLift”,”lessons”,”parking”,”meals”,”lodging”,”buyHelmet”,”buyGoggles”,”buyGloves”,”buyLayers”,”helmetCost”,”goggleCost”,”gloveCost”,”layerCost”];
const money = n => new Intl.NumberFormat(“en-US”, { style: “currency”, currency: “USD”, maximumFractionDigits: 0 }).format(Math.max(0, Math.round(n)));
function v(id) {
const el = document.getElementById(id);
return el.tagName === “SELECT” ? el.value : Number(el.value || 0);
}
function calc() {
const people = v(“adults”) + v(“kids”);
const days = v(“days”);
const rentals = (v(“adults”) * v(“adultRental”) + v(“kids”) * v(“kidRental”)) * days;
const lift = (v(“adults”) * v(“adultLift”) + v(“kids”) * v(“kidLift”)) * days;
const gear =
(v(“buyHelmet”) === “yes” ? people * v(“helmetCost”) : 0) +
(v(“buyGoggles”) === “yes” ? people * v(“goggleCost”) : 0) +
(v(“buyGloves”) === “yes” ? people * v(“gloveCost”) : 0) +
(v(“buyLayers”) === “yes” ? people * v(“layerCost”) : 0);
const meals = people * v(“meals”) * Math.max(1, days);
const lodging = v(“nights”) * v(“lodging”);
const total = rentals + lift + gear + v(“lessons”) + v(“parking”) + meals + lodging;
document.getElementById(“rentals”).textContent = money(rentals);
document.getElementById(“gear”).textContent = money(gear);
document.getElementById(“lift”).textContent = money(lift);
document.getElementById(“lessonOut”).textContent = money(v(“lessons”));
document.getElementById(“parkingOut”).textContent = money(v(“parking”));
document.getElementById(“mealOut”).textContent = money(meals);
document.getElementById(“lodgingOut”).textContent = money(lodging);
document.getElementById(“total”).textContent = money(total);
const perPerson = people ? total / people : 0;
document.getElementById(“note”).textContent = `Estimated ${money(perPerson)} per person. For first trips, consider renting skis, boots, and poles while buying personal comfort gear like goggles, gloves, socks/base layers, and a well-fitting helmet when the fit and certification are right.`;
}
ids.forEach(id => document.getElementById(id).addEventListener(“input”, calc));
calc();