5.0.0 • Published 3 years ago

hex-rgb v5.0.0

Weekly downloads
106,957
License
MIT
Repository
github
Last release
3 years ago

hex-rgb

Convert HEX color to RGBA

Install

$ npm install hex-rgb

Usage

import hexRgb from 'hex-rgb';

hexRgb('4183c4');
//=> {red: 65, green: 131, blue: 196, alpha: 1}

hexRgb('#4183c4');
//=> {red: 65, green: 131, blue: 196, alpha: 1}

hexRgb('#fff');
//=> {red: 255, green: 255, blue: 255, alpha: 1}

hexRgb('#22222299');
//=> {red: 34, green: 34, blue: 34, alpha: 0.6}

hexRgb('#0006');
//=> {red: 0, green: 0, blue: 0, alpha: 0.4}

hexRgb('#cd2222cc');
//=> {red: 205, green: 34, blue: 34, alpha: 0.8}

hexRgb('#cd2222cc', {format: 'array'});
//=> [205, 34, 34, 0.8]

hexRgb('#cd2222cc', {format: 'css'});
//=> 'rgb(205 34 34 / 80%)'

hexRgb('#000', {format: 'css'});
//=> 'rgb(0 0 0)'

hexRgb('#22222299', {alpha: 1});
//=> {red: 34, green: 34, blue: 34, alpha: 1}

hexRgb('#fff', {alpha: 0.5});
//=> {red: 255, green: 255, blue: 255, alpha: 0.5}

API

hexRgb(hex, options?)

hex

Type: string

The color in HEX format. Leading # is optional.

options

Type: object

format

Type: string\ Values: 'object' | 'array' | 'css'\ Defaults: 'object'

The RGB output format.

Note that when using the css format, the value of the alpha channel is rounded to two decimal places.

alpha

Type: number

Set the alpha of the color.

This overrides any existing alpha component in the Hex color string. For example, the 99 in #22222299.

The number must be in the range 0 to 1.

Related

See rgb-hex for the inverse.

documents-service-apiiterm-tabcolortabcolorgraasp-insightspvmed-visual@ideas-lab/netgraph@getcircuit/tailwind@atua/tokens@infinitebrahmanuniverse/nolb-hex-@sdaragon/desy-html-starter@pixiebrix/extension@everything-registry/sub-chunk-1841fig-toolsfigma-ui-kitflawwwless-libraryflwwwenlighten-x-componentsiobroker.wledhyper-ibmcloud-theme@entur/tokens@euax-ui/utils@envoy/ember-ui-kit@erickmerchant/favicongatsby-theme-gatsbyjs-websitegas3d.gl@eaze/herogot-color@fimblr/ui-corehex-rgb-clihex-to-xyganymede-itermget-color-nameget-color-themesglplottergithub-doodlejohnytest@edquity/edquity-react-componentsparse-css-colorpalette-loversoil-paintsosm-ui-reactnorska-cssname-the-colornearest-pantonephilips-wiz-bulbsphilterpicklejsnode-luxafornodal-backgroundnode-red-huemagmaptalks.autogradualmrspd-chartpolitico-style@atlasbot/colourterm-schemesteeny-colorcomplem8convert-colorconvert-color-jscolorize-transit-graphclipboard-colorspace-conversiontailwindcss-elevationtailwindcss-plugin-elevationtailwind-config-norskastring-to-colorburanosurrogate-mapcolor-clicolor-curve-adjustcolor-switchcolorname-to-xyreact-native-edison-calanderrbxthemereact-avatar-generatorreact-onboarderslate-editor-iconsspectacle-theme-ankerspectacle-theme-novashiki-renderer-pdfsindresorhus.jsapp-image-generatorarena-plugin-reportsshorten-hex-colorats-componentsats-test3animate-vpaid-bridgealfred-femineawsnapssb-patchworkremovdrecolor-imgreact-css-mixinsreact-craftify-corereact-cremereact-leaflet-extendedreact-native-color-lensreact-native-swift-basereact-native-particles-webglreactidskreact-skia-fiber
5.0.0

3 years ago

4.3.0

3 years ago

4.2.0

4 years ago

4.1.0

5 years ago

4.0.0

5 years ago

3.0.0

6 years ago

2.0.0

6 years ago

1.0.0

10 years ago