Japanese restaurant · Light

Omakase

Graphic pop of a counter-service menu: flat red, cream and navy blue, fat letters with hard shadows, floating food cut-outs and marquee ribbons crossing the screen.

Palette

--vermelho#c8261e
background of the hero and the closing (darkened: small cream text 4.8:1)
--creme#f8ecda
giant letters, morning section, cards
--marinho#1c3989
menu section, marquee ribbon, tags
--salmao#ff885b
giant menu word, reviews section, hours
--noite#1e2022
night section, solid buttons, hard shadow of the letters
--lima#a8c73c
rotating seal, menu CTA, border of the featured card
--texto#1e2022
text on cream/salmon
--texto-2#6e5a4c
descriptions on cards

Typography

Display: extra-heavy wide grotesque, weight 900, uppercase, tracking -0.02em, with an offset hard shadow (6px 6px 0 --noite); giant word at clamp(6rem,22vw,20rem) — suggestions: Archivo Black / Dela Gothic One.
Display 2: heavy slab serif in mixed case for exclamations and large hours — suggestions: Alfa Slab One / Rozha One.
Body: rounded grotesque 500–700, 11–14px — suggestions: DM Sans / Manrope.
Support/labels: same family 800 at 9–10px uppercase inside tags and pills.
Treatments: hard shadow on all large words; giant word cut across by a food cut-out sitting on top; tiny vertical text on the side edges; tilted ribbon with text and circular icons.

Sections

Nav — logo in a red tag with a border on the left; 3 cream outline pills with a hard shadow in the center; black pill on the right.
Hero — red background, giant cream name with a shadow; cut-out sushi boat crossing the letters; chopsticks, sauce, ginger and a rotating green seal scattered around; tilted navy tag; short text at the bottom left; "open now" status + pill on the right; falling petals.
Ribbons — two marquee ribbons tilted in an X (cream with red text, black with cream text) cross the transition into the navy.
Day at the counter (pin) — giant time in slab with a shadow, title, paragraph and two tilted photos with white frames; hour chips at the base; the background changes color each hour (cream → … → night).
Panorama — wide photo of the dining room running horizontally with pin tags over points; giant salmon slab exclamation at the base.
Menu — navy background, giant salmon word; tilted dish cards moving across a horizontal track (photo, name, price, description); lime pill.
Reviews — salmon background, hanging polaroids with a quote; black marquee ribbon; paper order slip with hours.
Closing — red background, sushi platter, order slip/receipt with hours, reservation button and farewell; giant name in the footer.

Motion and interaction

Floating cut-outs: cursor → each cut-out shifts with a different depth (±8–30px) and damping; scroll → parallax and exit upward.
Rotating seal: continuous → rotate 360° in 12s linear.
Petals: continuous → DOM/canvas particles falling with a sinusoidal sway.
Ribbons: continuous + scroll → infinite horizontal marquee; speed increases with scroll speed.
Day at the counter: pin + scrub → time swaps, background interpolates color, photos enter spinning.
Panorama: horizontal pin → image translates sideways; tags appear with a pop.
Menu: horizontal pin → cards on a track with alternating rotations; giant word in parallax.
Tech: GSAP ScrollTrigger, Lenis, CSS.

Components

Nav pill: cream background, 2px --noite border, 2px 2px 0 hard shadow, 9px 800 uppercase text.
Tilted tag: navy rectangle rotated -6°, 9px 800 cream text.
Circular seal: lime, text on a circle (SVG textPath), symbol in the center.
Framed photo: 6px white border, 10px radius, rotation ±5°, hard shadow.
Dish card: cream background, 14px radius, 3px colored border, 4:3 photo, 16px name, price on the right, 9px description.
Marquee ribbon: 44px strip, rotation ±4°, display 2 text + a circular icon between items.
Order slip: cream paper, serrated border, dotted day/time lines, black button.