Low contrast in the "contrast" style

[daniel-j-h]

Hey folks I was playing around with the map styles and found the contrast style to be fitting well for a side project I'm running out.

Unfortunately the contrast style seem to have very low contrast in a few places, check this annotated screen grab

As an example the contrast ratio between the text and the water background is 1.41:1 (check here).

The cases I could spot check were

color	entity
#9590aa	text
#84b7cf	water
#bfc99c	vegetation
#5c4a6b	borders

As a second note: the landuse colors are sticking out even at low zoom levels that I had to remove them - these were layers

["landuse_park", "natural_wood", "natural_scrub", "natural_sand", "landuse_beach"]

I was wondering if it makes sense to remove these by default until we have proper landuse information from #154?

[bdon]

Thanks for the feedback - the "Contrast" style was contributed by @cashc and isn't one of the five styles (light, dark, black, grayscale, white) I'm working on actively maintaining. In the future I would prefer to leave contributed styles to a separate repository, but in the meantime could you find a compromise change to improve the contrast of region labels that may appear over both land/water?

[daniel-j-h]

Gotcha, I didn't know that and that makes perfectly sense! Maybe @cashc has thoughts here then 🙇

What would help is making it explicit e.g. in the readme or documentation that the light, dark, black, grayscale, and white styles are the main ones going forward. Just to set expectation for users 🤗

[cashc]

Hey @daniel-j-h, I agree, that contrast theme needs some work. We at WWOOF decided to maintain our own theme since there wasn't clear consensus on the design specifications for a protomaps theme and we needed a more custom map design. Here's our theme (live), which is a slight deviation from the contrast theme. I'd love to see a community-supported contrast theme we could share! Looking forward to that contributed styles repo you speak of, Brandon!

export default {
  hasCasings: true,
  background: '#dddddd',
  earth: '#ededed',
  park: '#bfc99c',
  hospital: '#ffeae8',
  industrial: '#f8ffed',
  school: '#f2fef9',
  wood: '#bfc99c',
  pedestrian: '#eef0f0',
  scrub: '#bfc99c',
  glacier: 'white',
  sand: '#ebe7da',
  aerodrome: '#dbe7e7',
  runway: '#d1d9d9',
  water: '#84b7cf',
  zoo: '#EBE6ED',
  tunnel_other_casing: '#ffffff',
  tunnel_other: '#f7f7f7',
  tunnel_minor_casing: '#e2e2e2',
  tunnel_minor: '#ebebeb',
  tunnel_medium_casing: '#e1e1e1',
  tunnel_medium: '#ebebeb',
  tunnel_major_casing: '#e3cfd3',
  tunnel_major: '#ebebeb',
  tunnel_highway_casing: '#ebcea2',
  tunnel_highway: '#ebebeb',
  buildings: '#cbcece',
  other: '#ffffff',
  minor_casing: '#e2e2e2',
  minor: '#fff2bb',
  medium_casing: '#e1e1e1',
  medium: '#ffea94',
  major_casing: '#e3cfd3',
  major: '#ffdf59',
  highway_casing: '#ebcea2',
  highway: '#e9ac77',
  railway: '#b3bcc9',
  railway_tracks: '#ffffff',
  boundaries: '#5c4a6b',
  waterway_label_halo: 'white',
  waterway_label: '#a4cae1',
  bridges_other_casing: '#ffffff',
  bridges_other: '#ffffff',
  bridges_minor_casing: '#e2e2e2',
  bridges_minor: 'white',
  bridges_medium_casing: '#e1e1e1',
  bridges_medium: '#ffffff',
  bridges_major_casing: '#e3cfd3',
  bridges_major: '#ffffff',
  bridges_highway_casing: '#ebcea2',
  bridges_highway: '#fefffc',
  roads_label: '#91888b',
  roads_label_halo: 'white',
  ocean_label: 'white',
  ocean_label_halo: '#a4cae1',
  peak_label: '#61bb5b',
  peak_label_halo: '#ffffff',
  subplace_label: '#757d91',
  subplace_label_halo: 'white',
  city_circle: '#666666',
  city_circle_stroke: 'white',
  city_label: '#3c3c3c',
  city_label_halo: 'white',
  state_label: '#777777',
  state_label_halo: 'white',
  country_label: '#9590aa',
  country_label_halo: 'white',
};

[daniel-j-h]

Awesome @cashc that is gorgeous! Wondering if you want to submit a PR with those changes and we just update that contrast theme for now in this repo until we have found a better place for it.

[cashc]

those changes are already in main thanks to #46. I think what's needed is messing with the layers in styles/src/base_layers.ts because I think there has been new layers added without new colors to support them and I suspect that's what's changed to cause the issues in your screenshot.

the project I'm working on has deviated our layers from the protomaps/basemaps layers so that's why we're not experiencing these issues (yet, probably 😅)