CSS-iga pildi monotoonne - CSS-trikid

Anonim

Elemendile saab alati filtri halltoonis tähenduses monotoonseks muuta:

Vaadake Code Cenil Chris Coyieri (@chriscoyier) pliiatsi monotoonset pilti.

Kui panete selle taustavärviga konteinerisse ja vähendate läbipaistmatust, saate värvilise monotoonse efekti:

Vaadake Code Cenil Chris Coyieri (@chriscoyier) pliiatsi monotoonset pilti.

Maarten van der Velde kirjutas, öeldes, et läbipaistmatuse vähendamise asemel võime selle kombineerida mix-blend-modeja kontrasti puhuda:

Vaadake Code Cenil Chris Coyieri (@chriscoyier) pliiatsi monotoonset pilti.

Amelia Bellamy-Royds hõlmas ka SVG värvifiltrite kasutamist, millel on hämmastav kontroll:

Vaadake CodePenilt Amelia Bellamy-Roydsi (@AmeliaBR) pliiatsi SVG Filters Grey -> inverteeritud ühevärvilist värvi.