CSS Photo Filter Playground

Creative

photo filters

SHOW HN2019

35points
12comments
#946of 2,195 in 2019
Top 44%of 2019 by points

How HN took it

RoastedHalf or more of the comments are critical

0 positive, 6 neutral or asking, 0 mixed, 6 critical, out of 12 comments about the project. Thread score -0.40.

Execution: 0 for, 3 againstPerformance: 0 for, 2 againstDesign: 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

  • Filters can be animated with CSS transitions

    From 2 comments
    • Sure they are: ``` figure { filter: grayscale(1); transition: filter .3s ease; } figure:hover { filter: none; } ```
      katsura on HN
    • They do, although the image processing can get sluggish on some devices so your mileage may vary when it comes to smoothly transitioning it.
      _bxg1 on HN

Objections

  • Images fail to load when Privacy Badger blocks Unsplash endpoints

    From 1 comment
    • FYI, I get a row of broken images along the top. Looks like Unsplash API endpoints are blocked as trackers in Privacy Badger (I assume due to the way they use it to track…
      soylentcola on HN
  • Site breaks when referer headers are disabled

    From 1 comment
    • If you have disabled referer headers, the site does not work ("Your request did not contain a Referrer header."). In Firefox the preference is network.http.referer.defaultPolicy.
      chaz6 on HN
  • Image filter processing is sluggish on some devices

    From 2 comments
    • They do, although the image processing can get sluggish on some devices so your mileage may vary when it comes to smoothly transitioning it.
      _bxg1 on HN
    • And by sluggish, it may mean no transition, as the time to compute one frame exceeds the transition time. This is especially true for larger images on older hidpi devices (like…
      mceachen on HN
  • Inline CSS used for filters is considered poor practice

    From 1 comment
    • I was taught to avoid inline CSS, like the CSS used to apply these filters. Was I taught wrong or does this site use less than ideal practices?
      MaximumYComb on HN

Requests

  • Allow downloading the photo after applying the effect

    From 1 comment
    • It would've been nice if I could download the photo after applying the effect.
      inmate4587 on HN
  • Link to caniuse entries for each filter setting

    From 1 comment
    • Would be nice to somehow display or directly link to the caniuse entry for each applied filter setting.
      technotarek on HN

Questions

  • Do the filter names mean anything?

    From 2 comments
    • I always see cutesy names attached to photo filters, but do they actually mean anything?
      ebg13 on HN
    • Usually these try to replicate the Instagram filters. For example, here is the description of some of them:…
      katsura on HN
  • Can filters be used with animation and transitions?

    From 1 comment
    • I should probably know this but are those filters usable with animation / transition. For example, color photo (no filter) to b&w filter? Or b&w filter to color photo (no filter)
      chiefalchemist on HN

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/21083620)