Tints and shades generator in React.

Overview

Reactry's shades

goals

  • add option to enter hexColor by hand
  • add option to get hexColor from clipboard
  • add option to set one of the shades or tints as the current color
  • add option to select HSL values
  • add shortcuts to manipulate RGB values at once
  • add option to export current palette as JSON
  • add option to export current palette as CSS classes

1.0.0 - future

  • a long way to go

0.6.0 - future

  • nothing yet

0.5.0 - 2022-02-10

  • implemented HSL sliders
  • implemented utils rgbToHsl() and hslToRgb()
  • added Vault with Curated, History and Saved tabs
  • added 3 butttons to open vault tabs
  • implemented Save button functionality
  • added 12 basic color buttons to allow mixing
  • styling changes to InputComponent

0.4.0 - 2022-02-08

  • better names for buttons
  • added a tone button
  • added empty vault that can be opened with Shift + V
  • now shortcuts don't work when called with Alt and Ctrl

0.3.0 - 2022-02-08

  • displaying palette colors as rows
  • using HTML's native slider control in NumberSlider
  • added custom styles for slider-thumb inNumberSlider.css

0.2.0 - 2022-02-07

  • added Darken, Lighten and Invert buttons
  • added Download tab with CSS output
  • added Copy and Download buttons
  • added output stats section
  • allowing the user to set colorname
  • allowing the user select which classes to export

0.1.0 - 2022-02-07

  • RGB sliders are working
  • displaying n tints and shades where n can be selected
  • added keyboard shortcuts to manipulate RGB values
You might also like...

Obsidian text generator Plugin Text generator using GPT-3 (OpenAI)

Obsidian text generator Plugin Text generator using GPT-3 (OpenAI)

is a handy plugin for Obsidian that helps you generate text content using the powerful language model GP

Dec 29, 2022

a babel plugin that can transform generator function to state machine, which is a ported version of typescript generator transform

Babel Plugin Lite Regenerator intro This babel plugin is a ported version of TypeScript generator transform. It can transform async and generator func

Jul 8, 2022

Types generator will help user to create TS types from JSON. Just paste your single object JSON the Types generator will auto-generate the interfaces for you. You can give a name for the root object

Types generator will help user to create TS types from JSON. Just paste your single object JSON the Types generator will auto-generate the interfaces for you. You can give a name for the root object

Types generator Types generator is a utility tool that will help User to create TS Interfaces from JSON. All you have to do is paste your single objec

Dec 6, 2022

โš›๏ธ ๐Ÿš€ A progressive static site generator for React.

โš›๏ธ ๐Ÿš€ A progressive static site generator for React.

You are viewing the docs for v7 of React Static. You can browse all historical versions via Github branches! React Static A progressive static-site ge

Dec 27, 2022

๐Ÿ˜‚ Meme Generator using React & imgflip API

Welcome to Meme Generator ๐Ÿ‘‹ ๐Ÿ˜‚ Meme Generator using React & imgflip API โœจ Video Installation Run yarn or npm install. Create an account here. Rename

Dec 19, 2021

Truth or Dare Generator App made using React.

Truth or Dare Generator App made using React.

Feb 28, 2022

Wallpaper generator in React.

Wallpaper generator in React.

Reactry's chessboard Reactry's chessboard is wallpaper generator written in React. goals ablity to select a custom color a button to randomize all opt

Oct 2, 2022

Password Generator React App

Password Generator React App

Deployed App Link Password Generator React App Password Generator This Password Generator application is made using React JS. This application is used

Apr 1, 2022

Recoil is an experimental state management library for React apps. It provides several capabilities that are difficult to achieve with React alone, while being compatible with the newest features of React.

Recoil ยท Recoil is an experimental set of utilities for state management with React. Please see the website: https://recoiljs.org Installation The Rec

Jan 8, 2023

A meme generator plugin for Figma and FigJam. Import memes from all over the internet with customizable captions and share it far and wide.

A meme generator plugin for Figma and FigJam. Import memes from all over the internet with customizable captions and share it far and wide.

Is This A Meme? ๐Ÿ’๐Ÿป ๐Ÿฆ‹ A meme generator plugin for Figma and FigJam. Import memes from all over the internet, add your captions, and share it far and

Aug 30, 2022

A tool set for CSS including fast detailed parser, walker, generator and lexer based on W3C specs and browser implementations

CSSTree CSSTree is a tool set for CSS: fast detailed parser (CSS โ†’ AST), walker (AST traversal), generator (AST โ†’ CSS) and lexer (validation and match

Dec 28, 2022

Password Generator - A fast, simple and powerful open-source utility tool for generating strong, unique and random passwords

A fast, simple and powerful open-source utility tool for generating strong, unique and random passwords. Password Generator is free to use as a secure password generator on any computer, phone, or tablet.

Aug 3, 2022

NoExGen is a node.js express application generator with modern folder structure, namespace/project mapping and much more! It contains preconfigured Settings and Routing files, ready to be used in any project.

Installation $ npm install -g noexgen Quick Start You can use Node Package Execution to create your node-express application as shown below: Create th

Oct 8, 2022

JavaScript OAuth 1.0a signature generator (RFC 5849) for node and the browser

OAuth 1.0a signature generator for node and the browser Compliant with RFC 5843 + Errata ID 2550 and community spec Installation Install with npm: npm

Dec 16, 2022

JavaScript documentation generator for node using markdown and jsdoc

Dox Dox is a JavaScript documentation generator written with node. Dox no longer generates an opinionated structure or style for your docs, it simply

Jan 7, 2023

tar-stream is a streaming tar parser and generator.

tar-stream tar-stream is a streaming tar parser and generator and nothing else. It is streams2 and operates purely using streams which means you can e

Jan 3, 2023

A GraphQL Generator for Mongo and CosmosDB

A GraphQL Generator for Mongo and CosmosDB

A GraphQL Function Starter Kit for Cosmos DB This is a starter kit for rapid development of a GraphQL API using the Mongo driver for Cosmos DB. You cr

Nov 12, 2021

A time-based one-time password (TOTP) generator and authenticator for Gun DB

A time-based one-time password (TOTP) generator and authenticator for Gun DB

Entangler A time-based one-time password (TOTP) generator and authenticator for Gun DB Entangler generates a 6 digit passcode every 30 seconds. It gen

Nov 9, 2022
Owner
Home for @iaseth's React Apps.
null
A tool for creating and maintaining cohesive, consistent, and accessible color palettes

Primer Prism Primer Prism is a tool for creating and maintaining cohesive, consistent, and accessible color palettes. ?? primer.style/prism ?? Read th

Primer 517 Jan 3, 2023
A simple Discord bot that will listen for HEX, RGB(a), and HSL(a) colors in a message, and provide a small image of that color.

Pigment For the teams of designers and developers out there - Pigment will listen for messages containing a HEX, RGB(a), or HSL(a) color, and provide

Conrad Crawford 17 Dec 8, 2022
:rainbow: Javascript color conversion and manipulation library

color JavaScript library for immutable color conversion and manipulation with support for CSS color strings. var color = Color('#7743CE').alpha(0.5).l

Qix 4.5k Jan 3, 2023
JavaScript Library for creating random pleasing colors and color schemes

#PleaseJS www.checkman.io/please Please.js is a polite companion that wants to help you make your projects beautiful. It uses HSV color space to creat

Jordan Checkman 2.3k Dec 22, 2022
Fast, small color manipulation and conversion for JavaScript

TinyColor JavaScript color tooling TinyColor is a small, fast library for color manipulation and conversion in JavaScript. It allows many forms of inp

Brian Grinstead 4.5k Jan 1, 2023
This repo contains resources & practice of project and files , while learning to master JS

Resources to learn JavaScript and conquer the world? Tutorials and Books JavaScript For Cats (http://jsforcats.com/) is a dead simply introduction for

abdulkareem alabi 1 Jan 6, 2022
Coloris - A lightweight and elegant JavaScript color picker. Written in vanilla ES6, no dependencies. Accessible.

Coloris A lightweight and elegant JavaScript color picker written in vanilla ES6. Convert any text input field into a color field. View demo Features

Momo Bassit 126 Dec 27, 2022
Color2k - a color parsing and manipulation lib served in roughly 2kB

color2k a color parsing and manipulation lib served in roughly 2kB or less (2.8kB to be more precise) color2k is a color parsing and manipulation libr

Rico Kahler 506 Dec 31, 2022
Create your own complete Web color system fast and easy!

Simpler Color Create your own complete Web color system fast and easy, from as little as one base color! Color is at the heart of every UI design syst

Arnel Enero 278 Dec 20, 2022
A TypeScript package to calculate WCAG 2.0/3.0 and APCA color contrasts

a11y-color-contrast A simple utility package for working with WCAG 2.2/3.0 color contrasts a11y: Built for checking how readable colors are together S

Sondre Aasemoen 10 Oct 10, 2022