Water.css

Dev tools

css stylesheet

SHOW HN2019

Legend

Water.css

A just-add-css collection of styles to make websites nicer

github.com

#classless css#css framework#default browser styles#css stylesheet

501points
104comments
#32of 2,195 in 2019
Top 2%of 2019 by points

How HN took it

MixedNo clear lean

16 positive, 20 neutral or asking, 1 mixed, 11 critical, out of 48 comments about the project. Thread score +0.14.

Design: 5 for, 5 againstIdea: 4 for, 4 againstPerformance: 0 for, 1 against

The thread, comment by comment

Each row is a top-level comment and its replies, in HN's order. Select a cell to open that comment on HN.

positive neutral or mixed critical about another commenter or something else the maker

What HN said

What people liked

  • Nice, clean, useful for quick pages.

    From 3 comments
    • This looks really nice, clean & functional. I'm integrating this into my personal website at this moment. Thanks!
      whouweling on HN
    • This is wonderful! Thank you.
      crushcrashcrush on HN
    • This looks really fun. Thanks for showing. Look forward to trying it.
      ngold on HN
  • Dark theme and light theme options appreciated.

    From 2 comments
    • Why? I make a bunch of tiny static websites for API demos and such, and always run against the same problem: I hate the browser's default styles but don't want to spend time…
      archmaster on HN
    • Looks really good! Definitely would use something like this for some quick pages alright. Two minor pieces of feedback — when I click "Switch theme", it seems to take you to…
      another-dave on HN

Objections

  • Browser default styles are fine or preferable to some.

    From 2 comments
    • The default style for browsers (if you do not put any css) looks rather good to me. I do not honestly understand what is the problem.
      enriquto on HN
    • I happen to prefer the browser's default styles. I only ever need to tamper with them if the browser's default styles are not used.
      zzo38computer on HN
  • Table design and checkboxes/radio support have issues.

    From 2 comments
    • That looks pretty neat. The table layout is ugly, though. As this is a pretty basic HTML table, you can't do much but you can certainly do better than a table with all borders. I…
      bhaak on HN
    • It seems to support check boxes but not radio buttons.
      bastawhiz on HN
  • Not suited to structured documents with navbars and footers.

    From 1 comment
    • I would like to see a version for those of us that structure our documents. What is this structure you speak of? Most people assume HTML has a 'head' and a 'body'. The head has…
      Theodores on HN

Requests

  • Add a simple CDN URL for including the CSS.

    From 1 comment
    • If your aim is to help people snazz up quick HTML pages, it would be helpful to have as simple URL to include the CSS. Something like watercss.com/light.css. This way, we don't…
      pradn on HN
  • Add prefers-color-scheme support.

    From 1 comment
    • You should consider shipping a combined css file that uses the prefers-color-scheme media query to show dark or light as appropriate!…
      peter_l_downs on HN
  • Support for radio buttons and footers.

    From 2 comments
    • It seems to support check boxes but not radio buttons.
      bastawhiz on HN
    • Thanks for the feedback, although I would like to make the point: Water.css does style structured websites and doesn't involve any floats or div tags anywhere. If not for…
      archmaster on HN

Questions

  • Is it similar to Milligram?

    From 1 comment
    • Is it similar to milligram[0] ? I'm genuinely asking, because my CSS "awareness" is so terrible, despite years of web development experience. I just can't figure CSS out. [0]…
      gingerlime on HN
  • Mixed content warning from the cat image.

    From 2 comments
    • Mixed content warning due to the cat picture.
      andreareina on HN
    • Looks really good! Definitely would use something like this for some quick pages alright. Two minor pieces of feedback — when I click "Switch theme", it seems to take you to…
      another-dave on HN

Alternatives named

  • Milligram

    From 1 comment
    • Is it similar to milligram[0] ? I'm genuinely asking, because my CSS "awareness" is so terrible, despite years of web development experience. I just can't figure CSS out. [0]…
      gingerlime on HN
  • Skeleton

    From 1 comment
    • http://getskeleton.com has been around since 2013, plus a dozen others. Sounds more like a discoverability issue?
      ricardobeat on HN
  • Picnic CSS

    From 1 comment
    • This reminds me of picnic.css [0], which uses the same technique of styling everything nicely by default, but adds some options for changing things when you want. [0]…
      kej on HN
  • Tacit

    From 1 comment
    • Tacit [1] does a little bit of this. https://yegor256.github.io/tacit/
      taspeotis on HN
  • Bootstrap

    From 1 comment

Category, keywords, summaries and labels on this page were made by AI (Thread Reader v2) and not checked by hand. Each point links to the comments it came from.

Add a badge to your READMEShown on HackerShow
[![Shown on HackerShow](https://hackershow.org/badge.svg)](https://hackershow.org/show/19593866)