4 ms·

Rapidly build efficient sites with Neat, the minimalist CSS framework

77 points by Bluestein 2y ago

deleted 2y ago
[deleted]
ChrisArchitect 2y ago
Shared by the dev in Show HN's often, Some more discussion in 2023: https://news.ycombinator.com/item?id=35708613 https://news.ycombinator.com/item?id=35708613
efilife 2y ago
Another one?
p0w3n3d 2y ago
I want this "rad widget" from examples. Where can I buy it? https://raw.githubusercontent.com/codazoda/neatcss-examples/main/image/shop.png https://raw.githubusercontent.com/codazoda/neatcss-examples/...
- phantomathkg 2y ago
  Google image search said. https://fidgetpads.com/product/blue-black-fidget-pad-controller-7-features-for-stress-relief/ https://fidgetpads.com/product/blue-black-fidget-pad-control...
  - Bluestein 2y ago
    Oh, this is actually a thing ... ... by it being on a sample page for the framework - the 'simple shop' samples - I thought the 'widget' was just a placeholder, with an AI generated image, perhaps.- But, no. It actually exists.-
arkh 2y ago
> Minified code requires the complexity of a transpiler and makes the site less open for inspection, learning, accessibility, and archive. The fun of "early" websites was the fact you could just read the source of something you thought was neat and then copy and paste it to your own website. Now you also got this nice animation.
- Bluestein 2y ago
  Totally. There was "transferability" of knowledge. You could look "under the hood" (boot).-
  - mrcartmeneses 2y ago
    The boot is the trunk, the hood is the bonnet
    - Bluestein 2y ago
      Took me a few rereads :) Entirely correct. Me bad.-
      - mrcartmeneses 2y ago
        You’re good
muhrizqiardi 2y ago
Similar things I recently found: https://simplecss.org/ https://simplecss.org/ https://cferdinandi.github.io/kraken/ https://cferdinandi.github.io/kraken/ https://concrete.style/ https://concrete.style/
- udkl 2y ago
  Also http://getskeleton.com/ http://getskeleton.com/
- memhole 2y ago
  I used this for a project recently: https://fomantic-ui.com/ https://fomantic-ui.com/
lerpgame 2y ago
[flagged]
cynicalsecurity 2y ago
If I wanted a minimalist CSS, I would simply write my own, which I already did many years ago. Learning someone else's CSS file as if it's another technology is a questionable fun.
- jkestner 2y ago
  More or less agree. Other comments talking about how we used to be able read source. My old school behavior is that I’ve built up my own CSS framework that I start any new site with. Nothing ambitious, just reflecting the way I want my sites to be quick to code and responsive. It is satisfying to make your tools. Granted, this is for my own small static sites, and I’ll still use Tailwind though I disagree with its philosophy, just because it’s good for prototyping (and then it sticks around) or is the basis for some other small theme I want to build on (like DaisyUI).
- _heimdall 2y ago
  Sharing CSS projects like this isn't just about getting a bunch of people to use it. Sharing ideas and patterns can be very helpful, especially to someone newer to CSS. You may pick up a minimal CSS stylesheet to get started and pretty quickly digging into it to see how it's actually built. There are also interesting patterns that can be learned from and adapted to your own code. PicoCSS[1] had a new release recently and there's some really interesting stuff in there. The biggest standout to me is how forms are handled and leverage semantic HTML ideas to automatically add form validation styles. [1] https://picocss.com/ https://picocss.com/
  - d1sxeyes 2y ago
    I love PicoCSS, but they go a bit beyond semanticism to build some of their components. For example 'article' becomes a card. Dropdowns use details/summary. Dialog close buttons use 'button rel="prev"' which is... maybe, I guess? If you consider a modal as some sort of shallow navigation... Anyway, they make relatively few compromises on semanticity, and as a result, they can deliver a very polished-looking final product with more features than a purely semantic framework could deliver. Again, I love it, just sometimes, you have to hold your nose a bit.
jph 2y ago
Neat lacks a header and navigation; this by design, and may be enough for simple sites. If you want more capability, Pure.css is good to try too https://purecss.io/ https://purecss.io/
- Bluestein 2y ago
  Nice! Noted.-
- riffraff 2y ago
  I remember using pure many years ago, I thought it had been abandoned since, but nice to see it's still kicking!
Am4TIfIsER0ppos 2y ago
http://motherfuckingwebsite.com/ http://motherfuckingwebsite.com/ but unironically
didgeoridoo 2y ago
Ah this project name brought back memories… https://github.com/thoughtbot/neat https://github.com/thoughtbot/neat + bourbon.io was my Sass toolkit of choice for many years back in the early 2010s. For a moment I thought it was getting a pure-CSS revival now that CSS can accomplish most grid/layout stuff natively.

77 points by Bluestein 2y ago

deleted 2y ago

[deleted]

Shared by the dev in Show HN's often, Some more discussion in 2023: https://news.ycombinator.com/item?id=35708613 https://news.ycombinator.com/item?id=35708613

efilife 2y ago

Another one?

p0w3n3d 2y ago

I want this "rad widget" from examples. Where can I buy it? https://raw.githubusercontent.com/codazoda/neatcss-examples/main/image/shop.png https://raw.githubusercontent.com/codazoda/neatcss-examples/...

phantomathkg 2y ago
Google image search said. https://fidgetpads.com/product/blue-black-fidget-pad-controller-7-features-for-stress-relief/ https://fidgetpads.com/product/blue-black-fidget-pad-control...
- Bluestein 2y ago
  Oh, this is actually a thing ... ... by it being on a sample page for the framework - the 'simple shop' samples - I thought the 'widget' was just a placeholder, with an AI generated image, perhaps.- But, no. It actually exists.-

arkh 2y ago

> Minified code requires the complexity of a transpiler and makes the site less open for inspection, learning, accessibility, and archive. The fun of "early" websites was the fact you could just read the source of something you thought was neat and then copy and paste it to your own website. Now you also got this nice animation.

Bluestein 2y ago
Totally. There was "transferability" of knowledge. You could look "under the hood" (boot).-
- mrcartmeneses 2y ago
  The boot is the trunk, the hood is the bonnet
  - Bluestein 2y ago
    Took me a few rereads :) Entirely correct. Me bad.-
    - mrcartmeneses 2y ago
      You’re good

muhrizqiardi 2y ago

Similar things I recently found: https://simplecss.org/ https://simplecss.org/ https://cferdinandi.github.io/kraken/ https://cferdinandi.github.io/kraken/ https://concrete.style/ https://concrete.style/

udkl 2y ago
Also http://getskeleton.com/ http://getskeleton.com/
memhole 2y ago
I used this for a project recently: https://fomantic-ui.com/ https://fomantic-ui.com/

lerpgame 2y ago

[flagged]

cynicalsecurity 2y ago

If I wanted a minimalist CSS, I would simply write my own, which I already did many years ago. Learning someone else's CSS file as if it's another technology is a questionable fun.

jkestner 2y ago
More or less agree. Other comments talking about how we used to be able read source. My old school behavior is that I’ve built up my own CSS framework that I start any new site with. Nothing ambitious, just reflecting the way I want my sites to be quick to code and responsive. It is satisfying to make your tools. Granted, this is for my own small static sites, and I’ll still use Tailwind though I disagree with its philosophy, just because it’s good for prototyping (and then it sticks around) or is the basis for some other small theme I want to build on (like DaisyUI).
_heimdall 2y ago
Sharing CSS projects like this isn't just about getting a bunch of people to use it. Sharing ideas and patterns can be very helpful, especially to someone newer to CSS. You may pick up a minimal CSS stylesheet to get started and pretty quickly digging into it to see how it's actually built. There are also interesting patterns that can be learned from and adapted to your own code. PicoCSS[1] had a new release recently and there's some really interesting stuff in there. The biggest standout to me is how forms are handled and leverage semantic HTML ideas to automatically add form validation styles. [1] https://picocss.com/ https://picocss.com/
- d1sxeyes 2y ago
  I love PicoCSS, but they go a bit beyond semanticism to build some of their components. For example 'article' becomes a card. Dropdowns use details/summary. Dialog close buttons use 'button rel="prev"' which is... maybe, I guess? If you consider a modal as some sort of shallow navigation... Anyway, they make relatively few compromises on semanticity, and as a result, they can deliver a very polished-looking final product with more features than a purely semantic framework could deliver. Again, I love it, just sometimes, you have to hold your nose a bit.

jph 2y ago

Neat lacks a header and navigation; this by design, and may be enough for simple sites. If you want more capability, Pure.css is good to try too https://purecss.io/ https://purecss.io/

Bluestein 2y ago
Nice! Noted.-
riffraff 2y ago
I remember using pure many years ago, I thought it had been abandoned since, but nice to see it's still kicking!

Am4TIfIsER0ppos 2y ago

http://motherfuckingwebsite.com/ http://motherfuckingwebsite.com/ but unironically

didgeoridoo 2y ago

Ah this project name brought back memories… https://github.com/thoughtbot/neat https://github.com/thoughtbot/neat + bourbon.io was my Sass toolkit of choice for many years back in the early 2010s. For a moment I thought it was getting a pure-CSS revival now that CSS can accomplish most grid/layout stuff natively.