app like that
matcha.css
matcha.css

Open-source platform for sharing knowledge, tracking tasks, and organizing projects. Includes features for markdown editing, task management, and content linking. Designed for collaboration and personal organization.

Features

GitHub Activity Overview

Displays an overview of your GitHub activity on your personal dashboard, including statistics and recent actions.

Project Management Integration

Integrates with GitLab and Jira to show project management updates directly on your dashboard.

GitHub Heatmap

Includes a heatmap visualization of contributions to track progress and activity over time.

Custom Build Tool

Allows users to obtain a custom build of matcha.css through a customizable form.

Styling and Scopes

Offers various styling options for sectioning, collapsibles, modals, navigation, headings, flow, forms, and more.

Extra Features

Includes additional options like layouts, utilities, syntax highlighting, code editor support, Istanbul coverage reports, form validation, discrete scrollbars, and break words.

Customize CSS Variables

Enables users to customize CSS variables for a more tailored design.

Append CSS

Allows users to append their own custom CSS styles to the final build without needing to fork the project.

Minify Option

Provides an option to minify CSS to reduce bundle size, with a warning about potential serverless function failures.

Preview Functionality

Offers a preview feature so users can see how their custom build will look before finalizing it.

CSS Utility Files

Provides a range of CSS files for various purposes like layouts, styling, syntax highlighting, form validation, and more.

Break Words

CSS file for breaking words to manage overflow in narrow containers.

Code Editor Styles

CSS file specifically for styling code editors.

Discreet Scrollbars

CSS for styling discreet scrollbars in a web application.

Form Validation

CSS file to style form validation elements.

Syntax Highlighting

Styles syntax highlighting within code blocks.

Istanbul Coverage

CSS related to Istanbul coverage reports for testing.

@break-words

Handles breaking of long words or strings to prevent overflow.

@code-editor

Includes styles for a code editor interface.

@discrete-scrollbars

Manages the visibility of scrollbars when not actively scrolling.

@istanbul-coverage

Provides visual indication layers for test coverage metrics.

@layouts

Contains different layout options for organizing content.

@root

Defines the root styles and variables for the application.

@syntax-highlighting

Styling specific for syntax highlighting in code blocks.

@utilities

Utility styles for common repetitive design patterns.

abbreviations

Provides styles for abbreviation elements with descriptions.

anchors

Includes styles for anchor links.

annotations

Styles for annotating content, such as comments or notes.

bars

Styling for various types of bars, like progress bars or navigation bars.

collapsibles

Includes styles for collapsible sections and containers.

computing

Designates styles intended for computational function displays.

flow

Styles control content flow and wrapping.

forms

Styling for form elements and controls.

headings

Defines styles for different levels of headings.

lists

Provides styling for ordered and unordered lists.

media

Incorporates styles for media elements, such as images and videos.

modals

Styles and functionality for modal window elements.

navigation

Styling for navigation components like menus and tabs.

sectioning

Defines sectioning elements and their styles.

styling

General styling rules not covered by specific categories.

tables

Provides styling for table elements.

Pricing Plans

Free

$0
per monthly

Pro

$5
per monthly