awesome-repositories.com
Blog
MCP
awesome-repositories.com

Discover the best open-source repositories with AI-powered search.

ExploreCurated searchesOpen-source alternativesSelf-hosted softwareBlogSitemap
ProjectMCP serverAboutHow we rankPress
LegalPrivacyTerms
© 2026 Bringes Technology SRL·VAT RO45896025·hello@awesome-repositories.com
una avatar

una/CSSgram

0
View on GitHub↗
5,398 stars·395 forks·HTML·MIT·20 viewsuna.github.io/CSSgram↗

CSSgram

CSSgram is a CSS image filter library and framework that provides a system of reusable mixins and classes for implementing visual image effects. It enables CSS-based image processing to modify the appearance of images directly in the browser without requiring server-side processing.

The project facilitates client-side photo processing and frontend visual styling by applying photographic style filters and color presets to web images. It uses a combination of CSS filters and blend modes to achieve these effects through the assignment of predefined class names to HTML elements.

Features

  • Image Visual Filters - Applies photographic styles and visual filters to images using CSS filters and blend modes.
  • Browser-Based Image Processing - Enables modifying image appearance directly in the browser without requiring server-side processing.
  • Client-Side Image Editing - Simulates professional photo editing effects directly in the browser without backend image manipulation.
  • CSS Image Filter Libraries - Provides a collection of CSS filters and blend modes to apply photographic styles using class names.
  • CSS Blend Modes - Implements photographic grading by merging color overlays with base images using CSS background-blend-mode.
  • CSS Filter Effects - Provides a framework of reusable mixins and classes for implementing visual image effects via CSS filters.
  • Declarative Styling Systems - Provides a declarative system to apply photographic looks by adding simple class names to HTML elements.
  • Style Mixins - Uses Sass mixins to generate reusable CSS blocks for applying complex filter sets.
  • CSS Visual Compositing - Combines multiple graphical effects like blur and contrast into single composite CSS properties for images.
  • CSS Class-Based Styling - Creates consistent aesthetic looks for website imagery through a system of reusable CSS classes.
  • Semantic Class Mapping - Maps semantic, human-readable class names to specific CSS filter and blend mode value strings.
  • CSS Libraries - CSS-based image filter library for web content.

Star history

Star history chart for una/cssgramStar history chart for una/cssgram

How this analysis was created: This summary and feature list were written by an AI model that read the project's README and public documentation pages. Each feature links to the documentation it came from; stars, license and language come straight from the GitHub API. The model does not read the source code, and the analysis is refreshed when the project is re-analysed. Learn more on our About page.

AI search

Explore more awesome repositories

Describe what you need in plain English — the AI ranks thousands of curated open-source projects by relevance.

Start searching with AI

Frequently asked questions

What does una/cssgram do?

CSSgram is a CSS image filter library and framework that provides a system of reusable mixins and classes for implementing visual image effects. It enables CSS-based image processing to modify the appearance of images directly in the browser without requiring server-side processing.

What are the main features of una/cssgram?

The main features of una/cssgram are: Image Visual Filters, Browser-Based Image Processing, Client-Side Image Editing, CSS Image Filter Libraries, CSS Blend Modes, CSS Filter Effects, Declarative Styling Systems, Style Mixins.

What are some open-source alternatives to una/cssgram?

Open-source alternatives to una/cssgram include: qishaoxuan/css_tricks — This project is a collection of reference guides and reusable patterns for implementing CSS layouts, typography, and… evanw/webgl-filter — This project is a browser-based graphics editor and image processing library that performs visual transformations… chokcoco/css-inspiration — This project is a curated collection of galleries and component libraries that demonstrate pure CSS visual effects, 3D… picturepan2/instagram.css — instagram.css is a CSS image filter library and a pure CSS UI component. It provides a collection of predefined… sakofchit/system.css — system.css is a CSS component library and design system used to build web applications that mimic the look and feel of… semantic-org/semantic-ui — Semantic-UI is an HTML and CSS UI framework consisting of a themed component library and a responsive layout…

Open-source alternatives to CSSgram

Similar open-source projects, ranked by how many features they share with CSSgram.
  • qishaoxuan/css_tricksQiShaoXuan avatar

    QiShaoXuan/css_tricks

    4,103View on GitHub↗

    This project is a collection of reference guides and reusable patterns for implementing CSS layouts, typography, and visual effects. It serves as a library of style snippets and implementation guides for structuring web pages and creating common user interface patterns. The repository provides specialized galleries for visual effects and UI component patterns. These include techniques for creating glassmorphism, complex geometric shapes, and interactive elements such as accordions, tooltips, and animated tab indicators. The project covers a broad range of frontend capabilities, including res

    CSScsscss3
    View on GitHub↗4,103
  • evanw/webgl-filterevanw avatar

    evanw/webgl-filter

    1,091View on GitHub↗

    This project is a browser-based graphics editor and image processing library that performs visual transformations directly within the web environment. It provides a toolset for loading local image files, applying complex visual effects, and exporting the modified results without requiring server-side data processing. The library utilizes hardware-accelerated fragment shaders to execute pixel-level operations on the graphics processing unit. By maintaining image data as textures within GPU memory and using an immediate-mode rendering pipeline, the system achieves real-time synchronization betw

    JavaScript
    View on GitHub↗1,091
  • chokcoco/css-inspirationchokcoco avatar

    chokcoco/CSS-Inspiration

    10,866View on GitHub↗

    This project is a curated collection of galleries and component libraries that demonstrate pure CSS visual effects, 3D transforms, animation patterns, and layout solutions. It serves as a visual catalog of interactive UI elements and graphics built exclusively with HTML and CSS. The collection distinguishes itself by implementing complex interactivity, such as state management and animation triggers, using only CSS pseudo-classes and keyframes without any JavaScript. It also features a system for generative art and algorithmic patterns, as well as spatial 3D constructions using perspective an

    CSS
    View on GitHub↗10,866
  • picturepan2/instagram.csspicturepan2 avatar

    picturepan2/instagram.css

    4,014View on GitHub↗

    instagram.css is a CSS image filter library and a pure CSS UI component. It provides a collection of predefined stylesheets designed to apply photographic filters and color grading to web images. The library achieves these visual effects without the use of JavaScript or external image processing libraries. It uses a system of CSS filter functions to orchestrate brightness, contrast, and saturation, mapping specific aesthetic names to hardcoded property sets. The project covers client-side image processing and frontend UI customization. It allows for the application of photo filters to create

    CSS
    View on GitHub↗4,014
  • See all 30 alternatives to CSSgram→