Palette & Purpose
Design desk / Menu color

A rich palette.
A readable menu.

Give every color a job before you decorate the page. This burgundy, peach and ink study shows how the same palette can create clear text or almost invisible detail.

Illustrative menu guide comparing ink on burgundy at 1.17:1 with ink on peach at 11.90:1, plus color roles and separate screen and print checks.
A fictional menu study using burgundy #501F2D, peach #F5DCD0 and ink #242329. The ratios describe opaque digital sRGB pairs; the printed menu still needs a final-size proof. Open the full-size visual →
01 / Build the system

Three colors.
Three useful jobs.

A restaurant menu has several reading tasks: finding a section, comparing dishes and checking a price. Keep these tasks visible first. A decorative color can be valuable without becoming the color of every line of text.

Peach / the surface

#F5DCD0

Use as the main reading field. It gives both dark colors a light background.

Ink / the information

#242329

Use for dish names, descriptions and prices on peach. Keep information in a predictable place.

Burgundy / the emphasis

#501F2D

Use for section headings, rules or a highlighted panel with peach text.

Both dark colors are useful against peach. Burgundy and ink are too similar in lightness to serve as a small-text/background pair. Changing their positions does not fix that relationship.

02 / Measure the pair

Contrast belongs to two adjacent colors.

A digital contrast ratio compares the relative luminance of text and its immediate background. The figures below are calculated from the exact opaque sRGB HEX values, with no photo, gradient or transparency underneath.

Measured sRGB text/background pairs
PairRatioUse in this study
Ink #242329
on peach #F5DCD0
11.90:1Body copy and prices
Burgundy #501F2D
on peach #F5DCD0
10.18:1Headings and emphasis
Ink #242329
on burgundy #501F2D
1.17:1Avoid for information text

For digital text, WCAG 2.2 criterion 1.4.3 specifies at least 4.5:1 for normal text and 3:1 for large text. Its large-text definition starts at 18 pt regular or 14 pt bold, approximately 24 CSS px or 18.7 CSS px bold. A heading label alone does not make text large. See W3C’s explanation of text contrast.

Displayed ratios are rounded to two decimals; threshold decisions use the unrounded result. A passing color pair does not certify an entire page as accessible. Size, font weight, spacing, zoom, content and interaction still need review.

03 / Apply the roles

Keep the dish.
Change the surface.

These two panels use identical sample content. The weak version places ink text on burgundy. The stronger version gives the text a peach reading field; burgundy can still frame or label the menu without sitting directly behind dark descriptions.

Fictional layout study, not a commissioned restaurant or a tested business result. The dish and price are illustrative. The weak panel repeats the content for visual comparison; the readable version supplies the same information.

A dark panel can still work.

Use peach text on burgundy: the contrast remains 10.18:1. Check every detail in that panel, including small notes and prices. Do not quietly change secondary copy back to ink.

For a QR menu, build dish information as live text where possible. Test it on a phone at its normal display size; a large design canvas can hide tiny final text. If the background becomes a food photograph, retest every area or add a solid reading field.

04 / Leave the screen

A HEX ratio is not a print proof.

The calculations above describe digital sRGB color pairs. They do not predict how ink, paper, coating and restaurant lighting will combine. A warm paper stock already changes the light field; a printer’s color conversion can change the dark colors as well.

  1. Print the final-size layout. Use the intended stock and production method, or request a proof that represents them.
  2. Read the smallest useful line. Check descriptions, notes and prices at a normal table distance, under the lighting where the menu will be used.
  3. Inspect fine details. Look for filled letter counters, broken thin strokes and glare on the chosen finish. Adjust the design, then proof again.

Ask the printer for the appropriate color profile and proofing process. This palette does not come with universal CMYK values or a guarantee of printed accessibility.

05 / Before sharing

Five checks
to keep nearby.

  • Assign roles: name the reading surface, information color and emphasis color.
  • Check all pairs: include prices, captions, highlighted sections and reversed text.
  • Check the destination: review the phone-sized export or live QR menu, not only the original canvas.
  • Keep labels explicit: do not use color alone to explain a dietary or menu category.
  • Proof print separately: approve the actual material and lighting test before ordering the run.

Save the palette with these roles, not just three swatches. A useful handover says which color sits behind each type of information and where a separate print check is still required.

Sources / Checked 9 October 2026

Use the rule in its proper context.

The digital thresholds and large-text definition above are based on W3C: Understanding SC 1.4.3, Contrast (Minimum). The WCAG 2.2 criterion defines the requirement. Color-role choices and the fictional menu are our design examples.

This guide explains text contrast; it is not a full WCAG audit, a print certification or evidence of sales performance.