Cornellbotanicgardens
Manifesto
Cool, spacious gallery — stark white canvas, precise sans-serif, warm amber focal points.




Click any value to copy. Roles are suggestions, not gospel.
Read off the live site. Treat it as reference, not a recipe.
| Role | Family | Size | Weight | Leading | Tracking | Sample |
|---|---|---|---|---|---|---|
| h1 | beausite-text | 73px | 300 | 1 | -1.83004px | Aa Bb Cc |
| h2 | beausite-text | 33px | 300 | 1.1 | -0.830626px | Aa Bb Cc |
| h3 | beausite-text | 33px | 300 | 1.1 | -0.830626px | Aa Bb Cc |
| body | beausite-detail | 16px | 400 | 1.5 | 0 | Aa Bb Cc |
| caption | beausite-detail | 15px | 400 | 1.5 | 0 | Aa Bb Cc |
| button | beausite-detail | 15px | 500 | 1.5 | 0 | Aa Bb Cc |
Max content width 1440px
:root {
--color-dominant: #f59515;
--color-surface: #a43404;
--color-ink: #fbd862;
--color-accent: #867866;
--color-detail: #d0c4bc;
}
/* CSS variables exposed by source */
:root {
--colors-grey-default: 246,246,245;
--colors-grey-dark: 224,224,224;
--colors-grey-light: 246,246,245;
--fui-input-transition-timing-function: cubic-bezier(0.4,0,0.2,1);
--fui-btn-vertical-align: middle;
--iti-triangle-border: calc(6px/2);
--iti-path-flags-1x: url(../img/flags.webp);
--fui-link-transition-duration: 0.15s;
--fui-alert-success-bg-color: #f3faf7;
--fui-repeater-add-btn-left: 0.75rem;
--fui-btn-border-style: none;
--fui-alert-font-size: 0.875rem;
--fui-signature-remove-btn-transform: translateY(-50%);
--fui-gray-900: #111827;
--iti-arrow-padding: 6px;
--fui-input-width: 100%;
--fui-table-add-btn-height: 14px;
--fui-submit-btn-spinner-color: #fff;
--fui-border: 0 solid #d1d5db;
--fui-label-line-height: 1.25;
--fui-label-font-weight: 500;
--fui-error-margin-top: 0.5rem;
--fui-table-remove-btn-transform: translate(-50%,-50%);
--fui-tab-active-font-weight: 500;
--fui-focus-border-color: #a4cafe;
--fui-repeater-add-btn-height: 14px;
--fui-table-remove-btn-height: 14px;
--fui-table-border-collapse: collapse;
--header-top-offset: 0px;
--tw-ring-color: rgb(59 130 246 / .5);
--fui-loading-animation: loading 0.5s infinite linear;
--fui-alert-error-color: #771d1d;
--fui-title-font-size: 1.4rem;
--grid-columns-sm: 12;
--fui-btn-font-size: 0.875rem;
--iti-dropdown-bg: #fff;
--fui-field-gutter: 0.5rem;
--container-padding-x: 4.6875vw;
--fui-signature-remove-btn-right: -14px;
--fui-signature-remove-btn-width: 0;
--fui-progress-height: 1.2rem;
--fui-gray-200: #e5e7eb;
--fui-border-color: #d1d5db;
--fui-repeater-remove-btn-icon-height: 14px;
--fui-select-bg-position: right 0.25rem center;
--fui-repeater-remove-btn-icon-top: 50%;
--iti-flag-sprite-height: 12px;
--fui-table-add-btn-padding-left: 2rem;
--fui-progress-font-size: 0.8rem;
--fui-loading-border-width: 2px;
--fui-repeater-add-btn-top: 0.75rem;
--fui-tab-active-border-bottom-color: transparent;
--fui-label-font-size: 0.875rem;
--fui-primary-color-hover: #2349e5;
--iti-spacer-horizontal: 8px;
--fui-gray-800: #1f2937;
--fui-select-padding-right: 2rem;
--fui-repeater-remove-btn-width: 0;
--fui-check-label-bg-color: #fff;
--fui-input-transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,transform;
}Drop-in prompt
Build a landing page in the visual style of Whitecube.
Reference design system (extracted from the live site):
- Palette: #f59515, #a43404, #fbd862, #867866, #d0c4bc
- Typefaces: beausite-text, beausite-detail
- Macrostructure: Manifesto
Use the dominant colour for surfaces, the accent sparingly,
and lean on type weight + scale rather than colour for hierarchy.
Full DESIGN.md: https://inspomcp.dev/api/design/whitecube-com