Back to palettes

Palette

Terrazzo Floor Art

A refined palette inspired by the subtle flecks and smooth tones of classic terrazzo flooring.

neutralminimal5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Terrazzo Floor Art reads on buttons, badges, and alerts before you commit.

This alert border and accent use the palette's detail color.

Marketing banner

Launch

Built with Terrazzo Floor Art.

A bolder treatment that stretches the primary and secondary colors across a full gradient banner.

Data visualization

#EDEBEB#B2ACAC#7D7878#5A6A70#3A4750

Palette guide

How to use Terrazzo Floor Art

Overview

The Terrazzo Floor Art palette offers a refined collection of subtle flecks and smooth tones, inspired by classic terrazzo flooring. It features the crisp #EDEBEB as a bright base, transitioning through the muted #B2ACAC and solid #7D7878. Deeper tones like #5A6A70 and the grounding #3A4750 provide sophistication and depth. This palette is perfect for designers and developers aiming for a minimalist, urban, and sophisticated aesthetic, emphasizing clean lines and a modern, concrete-inspired feel.

Best used for

  • Modern architectural design visualizations
  • Minimalist UI/UX design for applications
  • Urban lifestyle brand identities
  • Tech company interfaces and branding
  • Industrial-chic interior design concepts
  • Sophisticated stationery and print materials

Suggested color roles

primary

Utilize #3A4750 as a deep, grounding, main brand color for strong headings or key graphical elements.

secondary

Employ #5A6A70 for supporting elements, secondary headings, or to provide subtle contrast.

accent

Apply #B2ACAC for subtle highlights, background details, or as a soft divider in minimalist layouts.

background

Use #EDEBEB as a clean, crisp base for main content areas, providing a bright and airy canvas.

text

Choose #3A4750 for primary body text and headings, ensuring excellent readability against lighter backgrounds, or use a deep charcoal for contrast.

Accessibility notes

  • Ensure #3A4750 provides excellent contrast on #EDEBEB for all text, meeting WCAG readability standards.
  • Use #7D7878 or darker for text on #EDEBEB to maintain good contrast; lighter grays may not be sufficient.
  • Avoid using #B2ACAC for essential text due to its low contrast; reserve it for decorative purposes or large elements.
  • Verify contrast ratios for all interactive elements and their various states to ensure clear usability.

Recommended combinations

Modern Grey

Create deep, sophisticated gradients, dark mode interfaces, or layered elements that convey urban elegance.

#3A4750 · #5A6A70 · #7D7878

Terrazzo Base

Design background textures, subtle layers, or UI components that emulate the flecked appearance of terrazzo.

#EDEBEB · #B2ACAC · #7D7878

Clean Contrast

Form a clear text-on-light-background combination, with the dark primary color on the bright base, accented by the mid-grey.

#3A4750 · #EDEBEB · #5A6A70

CSS variables

:root {
  --terrazzo-floor-art-1: #EDEBEB;
  --terrazzo-floor-art-2: #B2ACAC;
  --terrazzo-floor-art-3: #7D7878;
  --terrazzo-floor-art-4: #5A6A70;
  --terrazzo-floor-art-5: #3A4750;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "terrazzo-floor-art": {
        1: "#EDEBEB",
        2: "#B2ACAC",
        3: "#7D7878",
        4: "#5A6A70",
        5: "#3A4750",
      }
    }
  }
}

Related searches

terrazzo color schememodern grey paletteminimalist urban designconcrete aesthetic colorsneutral sophisticated hex

Palette colors

Hex values

Color 1#EDEBEB
·
Color 2#B2ACAC
·
Color 3#7D7878
·
Color 4#5A6A70
·
Color 5#3A4750
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.9:1Fail
3.7:1AA18
4.7:1AA
8:1AAA
2
1.9:1Fail
1.9:1Fail
2.5:1Fail
4.3:1AA18
3
3.7:1AA18
1.9:1Fail
1.3:1Fail
2.2:1Fail
4
4.7:1AA
2.5:1Fail
1.3:1Fail
1.7:1Fail
5
8:1AAA
4.3:1AA18
2.2:1Fail
1.7:1Fail

Similar palettes

More like Terrazzo Floor Art

View all neutral