Location map image
Sacramento
2080 Enterprise Blvd Suite 100
West Sacramento, CA 95691
Directions
Internal reference
Visual foundations
The living reference for Buywander’s global tokens and shared UI primitives. New rebrand work should use the documented components and variants below.
Color
Black
--bw-color-black
White
--bw-color-white
Magenta
--bw-color-magenta
Deep navy
--bw-color-navy
Maroon
--bw-color-maroon
Forest
--bw-color-forest
Violet
--bw-color-violet
Light blue
--bw-color-light-blue
Lime green
--bw-color-lime
Yellow
--bw-color-yellow
Orange
--bw-color-orange
Pastel pink
--bw-color-pastel-pink
Approved foreground / background pairings
Magenta / WhiteNavy / WhiteOrange / BlackYellow / BlackForest / WhitePastel pink / MagentaLime / ForestViolet / Yellow
Shared primitives
These components are the implementation source for new rebrand UI. Update tokens in assets/css/design-tokens.css or shared variants in assets/css/design-system.css; the guide and every consumer update together.
Heading and surface
Use BwHeading for display type and BwSurface for bordered content groups.
Pills and actions
Appears New
Typography
Heading 1
Heading 2
Heading 3
Heading 4
Text large
Text medium
Text regular
Text small
Text tiny
Static-page system
Shared rebrand patterns used across About, How It Works, Locations, and Contact. Display titles use the Adobe Coolvetica face at the heavier headline weight.
Style guide
Headline treatment
Pastel-pink heroes use the brand star texture, rounded lower corners, and the shared display type scale.
Ready to find your fortune?
The next hidden gem is up for grabs.
Create Free AccountLog in
How it works
✦ Step 1
Browse auctions
Image-led editorial steps connect with the supplied dashed path.
Step image
and illustration
and illustration
About page treatments
Category and benefit pills
Fortune foundPure thrillOwn the winYou set the pricePlanet friendly
Product card
The homepage card is fed by the public auction-search response: image, title, condition, current price, retail price, and end date. Watch and bid actions connect to existing auction endpoints; editorial homepage content stays in Sanity.
Appears new$49.99
$179.99
Ends Fri Dec 31 at 11:59 PM
Auction unavailable
Interaction states
Hover the image, title, heart, and bid control. Focus states are included for keyboard users.
Watchlist states
Toggle the preview to inspect both states without signing in.
Not watching — magenta outline
Condition badges
Appears NewGently UsedUsedHeavy UseEasy FixMajor FixMixed Condition
Auction states
These examples verify the neutral, winning, and losing treatments without requiring a live auction.
Neutral
Appears new$49.99
$179.99
Ends Fri Dec 31 at 11:59 PM
Auction unavailable
Winning
Appears newWinning$49.99
$179.99
Ends Fri Dec 31 at 11:59 PM
Auction unavailable
Losing
Appears newLosing$49.99
$179.99
Ends Fri Dec 31 at 11:59 PM
Auction unavailable
Homepage rails
The live homepage hero demonstrates the CMS-driven feature-card treatment. Product rails, category rails, campaign banners, tickers, and social proof all use the same rounded cards, responsive spacing, and hover language.
Full-width ticker ribbon
Editor-controlled word breaks
The Heading field accepts new lines. The rail preserves them while keeping artwork oversized and clipped inside the rounded card.
Header and auction controls
The shared site header above this page is the source of truth for navigation. These are the live auction toolbar components and their responsive treatments.
Filter, search, and sort icons use the local SVG collection. The search sample has autocomplete disabled here, so it cannot make API requests from the style guide.
Auction status pills
Watchlist2Winning2Losing4
Auction filters
The same filter controls used by the auction page. This sample keeps its selections locally so it is safe to test without changing the live results.
Filters
No categories match the current filters.
Mobile filter sheet
×No categories match the current filters.
Auction results states
Shared loading-adjacent outcomes for auction search. They use the existing search response and do not make API requests from this page.
No auctions found
Try adjusting your filters or search criteria.
We couldn’t load auctions
The current filters are preserved so the shopper can safely try again.
No exact matches
Here are similar auctions that may still be a great fit.
Account navigation
Shared dashboard navigation used as horizontal pills on desktop and in the authenticated mobile account drawer.
Desktop treatment
Mobile drawer treatment
My accountMy auctionsAuction historyFeesCartOrdersAppointments
Log out Help
Buttons
Hover and focus the controls below. Primary and secondary calls to action use the shared CSS transition; magnetic calls to action also receive the live GSAP pointer response on fine pointers.
Interaction and motion
These are the shipped hover and selection behaviors. Motion is disabled automatically when the visitor requests reduced motion or uses a coarse pointer.
About category pills
Hover a pill for its fill transition; select one to preview the active color pairing. The live About explorer adds the magnetic movement and floating-image transition.
Surface and link states
Lift on hover
Cards rise slightly and image-led content scales subtly rather than changing color abruptly.
Fields and surfaces
Auction card surface
Use this treatment for grouped product information and supporting content.