takamoso / cluestack

A list of awesome front-end tools.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Cluestack

Platforms

Languages

Media

Contents

CSS

Classless

  • attriCSS - AttriCSS is a classless css framework that style normal ugly html to beautiful website.
  • axist - Minimal (5kb) drop-in CSS library.
  • bahunya - 10KB classless CSS framework with a navbar and dark styling.

Components

  • system.css - A design system for building retro Apple interfaces.
  • paper-prototype-css - CSS Designed to look a bit like a paper prototype.
  • pokemon-cards-css - A collection of advanced CSS styles to create realistic-looking effects for the faces of Pokemon cards.
  • devices.css - Modern devices crafted in pure CSS.
  • metallicss - Versatile metallic finish for CSS.
  • charts.css - Open source CSS framework for data visualization.

Animations

  • mimic.css - Mimic.css is an css animations library because everyone else is doing it.

Util

  • open-props - CSS custom properties to help accelerate adaptive and consistent design.

JavaScript

Plugins

  • critical - Extract & Inline Critical-path CSS in HTML pages.

Applications

  • neutralinojs - Portable and lightweight cross-platform desktop application development framework.
  • gluon - A new framework for creating desktop apps from websites, using system installed browsers and NodeJS.
  • PWABuilder - The simplest way to create progressive web apps across platforms and devices. Start here. This repo is home to several projects in the PWABuilder family of tools.
  • tauri - Build smaller, faster, and more secure desktop applications with a web frontend.

Collections

  • ui.mantine.dev - Mantine UI website and components.
  • tailblocks - Ready-to-use Tailwind CSS blocks.
  • tailwind-ui-components - Free Tailwind CSS UI Components - Crafted for modern websites, landing pages and web apps. TailGrids Core is free and open-source so, feel free to use with your personal or commercial projects.
  • Tailwind UI - Beautiful UI components and templates by the creators of Tailwind CSS.
  • flowrift - Beautifully designed Tailwind CSS UI blocks.

Modal

  • Micromodal - Tiny javascript library for creating accessible modal dialogs.
  • a11y-dialog - A very lightweight and flexible accessible modal dialog script.

Form

Input

  • imaskjs - Vanilla javascript input mask.
  • autoComplete.js - Simple autocomplete pure vanilla Javascript library.
  • text-mask - Input mask for React, Angular, Ember, Vue, & plain JavaScript.
  • autocomp.js - A super tiny Javascript autocomplete / autosuggestions library. Zero dependencies, ~800 bytes min+gzip.

Validation

  • validator.js - A library of string validators and sanitizers.

Picker

Syntax Highlighting

Scroll

  • sticky-sidebar-v2 - About Pure JavaScript tool for making smart and high performance sticky sidebar.
  • OverlayScrollbars - A javascript scrollbar plugin that hides native scrollbars, provides custom styleable overlay scrollbars and keeps the native functionality and feeling.
  • ScrollTrigger - Let your page react to scroll changes.
  • lenis - How smooth scroll should be.

Drag

  • neodrag - One Draggable to rule them all.

SVG

  • satori - Enlightened library to convert HTML and CSS to SVG.
  • svg-path-morph - Smoothly interpolate between variations of SVG paths.

Canvas

  • canvas-confetti - On-demand confetti gun.
  • lazy-brush - Smooth drawing with mouse, finger or other pointing device.
  • idraw - A simple JavaScript framework for Drawing on the web.
  • perfect-freehand - Draw perfect pressure-sensitive freehand lines.
  • atrament.js - A small JS library for beautiful drawing and handwriting on the HTML Canvas.

Typography

  • Hyphenopoly - Hyphenation for node and Polyfill for client-side hyphenation.
  • budoux - BudouX is the successor to Budou, the machine learning powered line break organizer tool.
  • alfaaz - The fastest multilingual word
  • fontsource - Self-host Open Source fonts in neatly bundled NPM packages.

Search

Visual

Files

API

DOM

  • cure53/DOMPurify - A DOM-only, super-fast, uber-tolerant XSS sanitizer for HTML, MathML and SVG. DOMPurify works with a secure default, but offers a lot of configurability and hooks.
  • apostrophecms/sanitize-html - Clean up user-submitted HTML, preserving whitelisted elements and whitelisted attributes on a per-element basis. Built on htmlparser2 for speed and tolerance.
  • article-extractor - To extract main article from given URL with Node.js.

Performance

  • danielroe/fontaine - Automatic font fallback based on font metrics.
  • aFarkas/lazysizes - High performance and SEO friendly lazy loader for images (responsive and normal), iframes and more, that detects any visibility changes triggered through user interaction, CSS or JavaScript without configuration.
  • barbajs/barba - Create badass, fluid and smooth transitions between your website’s pages.
  • weebney/tachyon - Make your site faster than light in <1 minute; instant page loads in 738 bytes.
  • richtr/NoSleep.js - Prevent display sleep and enable wake lock in any Android or iOS web browser.

Security

CLI

Bash

  • google/zx - A tool for writing better scripts.

Lint

Full-text Search

  • lucaong/minisearch - Tiny and powerful JavaScript full-text search engine for browser and Node.

Date

Ofiice

  • dolanmiu/docx - Easily generate and modify .docx files with JS/TS with a nice declarative API. Works for Node and on the Browser.
  • SheetJS/sheetjs - SheetJS Spreadsheet Data Toolkit.

Regex

Util

AI

  • japanese-stablelm-instruct-alpha-7b-v2 - A 7B parameter decoder-only language models pre-trained built on top of the Japanese-StableLM-Base-Alpha-7B model and further fine-tuned on various instruction-following datasets.

Dataset

API

Media

Emojis

Logos

  • browser-logos - High resolution web browser logos.
  • devicon - Set of icons representing programming languages, designing & development tools.

National Flags

  • circle-flags - A collection of 400+ minimal circular SVG country and state flags.

Patterns

  • hero-patterns - A collection of repeatable SVG background patterns for you to use on your digital projects.

Illustrations

  • nice-illustrations - Free illustrations you can use for your design projects. Click to download hundreds of beautiful vector illustrations for free today!

Fonts

  • フォントダス - A site where you can find free and commercially available free fonts.

Japanese

  • LINE Seed JP - Meet LINE Seed. LINE'S very first typeface is born.
  • 殴り書きクレヨン - This is a handwritten font with a crayon touch. Some characters are difficult to read because they are written by blows. Kanji characters are included up to the first level.
  • りんごひめ - This Japanese OpenType font is based on hand-drawn characters and was created with the image of a logo from a girl's magazine in the Showa period.
  • クラフト明朝 - This is a hand-drawn Mincho font with a good degree of fading.
  • とらいあんぐるDemo - Cute round gothic for title logos and headlines with an impressive triangular shape.
  • どきどきファンタジア - Cute and POP, Round Gothic for headlines and logos. Sentence.
  • レトロランプフォント - This font was inspired by the lettering of the logo of the incandescent light bulb "Tou-Lamp®" sold by the now defunct Toko Electric Co.
  • エビハラのくせ字 - I actually made a font of my own handwriting, which is often said to be "font-like.
  • トレゴ - This font was inspired by the European typeface Trajan Sans. It has a retro feel, like a signboard of a beauty parlor or women's clothing shop in an old shopping street.

Chrome Extensions

  • PixelZoomer - PixelZoomer takes a website screenshot and provides a measuring tool, a zoom and an eye dropper.
  • Web Vitals - This extension measures the Core Web Vitals, providing instant feedback on loading, interactivity and layout shift metrics. It is consistent with how these metrics are measured by Chrome and reported to other Google tools.

About

A list of awesome front-end tools.