Awesome

Priceline Design System

bundlephobia-badge

npm install pcln-design-system

Contributing

If you'd like to contribute to the Design System, we'd love to have your help. If you work at Priceline.com, please join the #design-system Slack channel and let us know what you'd like to work on.

For all contributors, please be sure to read the Contributing doc.

Documentation

Storybook

Motivation

To create a consistently great experience for our users, the Design System is meant to be the single source of truth for user interface standards for both designers and developers.

Built off of the work of previous efforts, this project intends to consolidate those ideas into a living, well-documented, and growing system.

Goals

The core goals of this project are to:

Speed up design and development velocity
Help create consistent, beautiful, and usable UI in our applications
Promote best practices for accessibility, internationalization, and responsive web design.

We hope to accomplish these goals by:

Reducing the number of decisions needed when iterating on UI
Reducing the amount of code duplication in our apps
Serving as the standard for Priceline.com's visual language
Providing easy-to-use and extensible components for anyone to consume.

MIT License

<table> <tr> <td align="center"><a href="https://github.com/haasalex16"><img src="https://avatars3.githubusercontent.com/u/10518812?v=4" width="100px;" alt="Alex Haas"/> Alex Haas</a> <a href="https://github.com/Priceline/design-system/commits?author=haasalex16" title="Code">💻</a></td> <td align="center"><a href="http://www.agustinbautista.com/"><img src="https://avatars0.githubusercontent.com/u/5533800?v=4" width="100px;" alt="Agustin Bautista"/> Agustin Bautista</a> <a href="https://github.com/Priceline/design-system/commits?author=abautist" title="Code">💻</a></td> <td align="center"><a href="http://www.barrymcgee.co.uk"><img src="https://avatars0.githubusercontent.com/u/505570?v=4" width="100px;" alt="Barry McGee"/> Barry McGee</a> <a href="https://github.com/Priceline/design-system/commits?author=barrymcgee" title="Code">💻</a></td> <td align="center"><a href="https://linkedin.com/in/benicheni"><img src="https://avatars2.githubusercontent.com/u/6441326?v=4" width="100px;" alt="Benjamin Chen"/> Benjamin Chen</a> <a href="https://github.com/Priceline/design-system/commits?author=BeniCheni" title="Code">💻</a></td> <td align="center"><a href="https://github.com/bertya"><img src="https://avatars3.githubusercontent.com/u/9540294?v=4" width="100px;" alt="Bing Bai"/> Bing Bai</a> <a href="https://github.com/Priceline/design-system/commits?author=bertya" title="Code">💻</a></td> <td align="center"><a href="https://jxnblk.com"><img src="https://avatars2.githubusercontent.com/u/3451712?v=4" width="100px;" alt="Brent Jackson"/> Brent Jackson</a> <a href="https://github.com/Priceline/design-system/commits?author=jxnblk" title="Code">💻</a></td> <td align="center"><a href="https://github.com/broox9"><img src="https://avatars1.githubusercontent.com/u/370264?v=4" width="100px;" alt="Brookes Stephens"/> Brookes Stephens</a> <a href="https://github.com/Priceline/design-system/commits?author=broox9" title="Code">💻</a></td> </tr> <tr> <td align="center"><a href="https://github.com/byrekt"><img src="https://avatars2.githubusercontent.com/u/1385339?v=4" width="100px;" alt="Byron Mitchell"/> Byron Mitchell</a> <a href="https://github.com/Priceline/design-system/commits?author=byrekt" title="Code">💻</a></td> <td align="center"><a href="https://github.com/jinchi2013"><img src="https://avatars0.githubusercontent.com/u/15325954?v=4" width="100px;" alt="Chi Jin"/> Chi Jin</a> <a href="https://github.com/Priceline/design-system/commits?author=jinchi2013" title="Code">💻</a></td> <td align="center"><a href="https://github.com/donnobot"><img src="https://avatars2.githubusercontent.com/u/1270178?v=4" width="100px;" alt="Chris Donnelly"/> Chris Donnelly</a> <a href="https://github.com/Priceline/design-system/commits?author=donnobot" title="Code">💻</a></td> <td align="center"><a href="http://chrisdroukas.com"><img src="https://avatars0.githubusercontent.com/u/1759514?v=4" width="100px;" alt="Chris Droukas"/> Chris Droukas</a> <a href="https://github.com/Priceline/design-system/commits?author=chrisdroukas" title="Code">💻</a></td> <td align="center"><a href="https://unscsprt.github.com"><img src="https://avatars1.githubusercontent.com/u/3260642?v=4" width="100px;" alt="Craig Palermo"/> Craig Palermo</a> <a href="https://github.com/Priceline/design-system/commits?author=unscsprt" title="Code">💻</a></td> <td align="center"><a href="https://danielgiraldo.com/"><img src="https://avatars1.githubusercontent.com/u/11232323" width="100px;" alt="Danny Giraldo"/> Danny Giraldo</a> <a href="https://github.com/Priceline/design-system/commits?author=dgiraldo313" title="Code">💻</a></td> <td align="center"><a href="https://github.com/daljeetk"><img src="https://avatars3.githubusercontent.com/u/32394093?v=4" width="100px;" alt="daljeetk"/> daljeetk</a> <a href="https://github.com/Priceline/design-system/commits?author=daljeetk" title="Code">💻</a></td> <td align="center"><a href="http://evanpipta.com"><img src="https://avatars3.githubusercontent.com/u/9023427?v=4" width="100px;" alt="Evan Pipta"/> Evan Pipta</a> <a href="https://github.com/Priceline/design-system/commits?author=747823" title="Code">💻</a></td> </tr> <tr> <td align="center"><a href="https://github.com/Degron"><img src="https://avatars0.githubusercontent.com/u/14366048?v=4" width="100px;" alt="Evgenii Bezpalko"/> Evgenii Bezpalko</a> <a href="https://github.com/Priceline/design-system/commits?author=Degron" title="Code">💻</a></td> <td align="center"><a href="https://github.com/cenjennifer"><img src="https://avatars3.githubusercontent.com/u/6467349?v=4" width="100px;" alt="Jennifer Cen"/> Jennifer Cen</a> <a href="https://github.com/Priceline/design-system/commits?author=cenjennifer" title="Code">💻</a></td> <td align="center"><a href="https://github.com/jes708"><img src="https://avatars3.githubusercontent.com/u/16601510?v=4" width="100px;" alt="Jonathan Schwarz"/> Jonathan Schwarz</a> <a href="https://github.com/Priceline/design-system/commits?author=jes708" title="Code">💻</a></td> <td align="center"><a href="https://github.com/lauradhahn"><img src="https://avatars1.githubusercontent.com/u/2086094?v=4" width="100px;" alt="lauradhahn"/> lauradhahn</a> <a href="https://github.com/Priceline/design-system/commits?author=lauradhahn" title="Code">💻</a></td> <td align="center"><a href="https://github.com/msafari"><img src="https://avatars0.githubusercontent.com/u/5679105?v=4" width="100px;" alt="Maedeh Safari"/> Maedeh Safari</a> <a href="https://github.com/Priceline/design-system/commits?author=msafari" title="Code">💻</a></td> <td align="center"><a href="https://github.com/hakimelek"><img src="https://avatars1.githubusercontent.com/u/1974993?v=4" width="100px;" alt="Malek Hakim"/> Malek Hakim</a> <a href="https://github.com/Priceline/design-system/commits?author=hakimelek" title="Code">💻</a></td> <td align="center"><a href="http://www.rinakrevat.com"><img src="https://avatars1.githubusercontent.com/u/1365995?v=4" width="100px;" alt="Rina Krevat"/> Rina Krevat</a> <a href="https://github.com/Priceline/design-system/commits?author=krevat" title="Code">💻</a></td> </tr> <tr> <td align="center"><a href="https://github.com/ronhenderson"><img src="https://avatars1.githubusercontent.com/u/5322552?v=4" width="100px;" alt="ronhenderson"/> ronhenderson</a> <a href="https://github.com/Priceline/design-system/commits?author=ronhenderson" title="Code">💻</a></td> <td align="center"><a href="https://github.com/sagarkaurav"><img src="https://avatars0.githubusercontent.com/u/8871080?v=4" width="100px;" alt="sagar kaurav"/> sagar kaurav</a> <a href="https://github.com/Priceline/design-system/commits?author=sagarkaurav" title="Code">💻</a></td> <td align="center"><a href="https://github.com/sivdahlberg"><img src="https://avatars3.githubusercontent.com/u/15033101?v=4" width="100px;" alt="sivdahlberg"/> sivdahlberg</a> <a href="https://github.com/Priceline/design-system/commits?author=sivdahlberg" title="Code">💻</a></td> <td align="center"><a href="https://github.com/sdalonzo"><img src="https://avatars0.githubusercontent.com/u/2132853?v=4" width="100px;" alt="Steve Dalonzo"/> Steve Dalonzo</a> <a href="https://github.com/Priceline/design-system/commits?author=sdalonzo" title="Code">💻</a></td> <td align="center"><a href="https://github.com/stephensulik"><img src="https://avatars2.githubusercontent.com/u/2953256?v=4" width="100px;" alt="Stephen Sulik"/> Stephen Sulik</a> <a href="https://github.com/Priceline/design-system/commits?author=stephensulik" title="Code">💻</a></td> <td align="center"><a href="https://github.com/tfquirk"><img src="https://avatars.githubusercontent.com/tfquirk" width="100px;" alt="Timothy Quirk"/> Timothy Quirk</a> <a href="https://github.com/Priceline/design-system/commits?author=tfquirk" title="Code">💻</a></td> <td align="center"><a href="https://github.com/tornglintaffychen"><img src="https://avatars1.githubusercontent.com/u/16071129?v=4" width="100px;" alt="Torng-Lin (Taffy) Chen"/> Torng-Lin (Taffy) Chen</a> <a href="https://github.com/Priceline/design-system/commits?author=tornglintaffychen" title="Code">💻</a></td> </tr> <tr> <td align="center"><a href="http://scottgary.com"><img src="https://avatars3.githubusercontent.com/u/45636494?v=4" width="100px;" alt="sqott"/> sqott</a> <a href="https://github.com/Priceline/design-system/commits?author=sqott" title="Code">💻</a></td> <td align="center"><a href="https://lundgren.tech"><img src="https://avatars2.githubusercontent.com/u/862774?v=4" width="100px;" alt="Tobias Lundgren"/> Tobias Lundgren</a> <a href="https://github.com/Priceline/design-system/commits?author=lundgren2" title="Code">💻</a></td> <td align="center"><a href="https://github.com/zerodom30"><img src="https://avatars0.githubusercontent.com/u/3496298?v=4" width="100px;" alt="Dom G."/> Dom G.</a> <a href="https://github.com/Priceline/design-system/commits?author=zerodom30" title="Code">💻</a></td> <td align="center"><a href="https://github.com/unixchad"><img src="https://avatars1.githubusercontent.com/u/3157593?v=4" width="100px;" alt="Kyle Pollock"/> Kyle Pollock</a> <a href="https://github.com/Priceline/design-system/commits?author=unixchad" title="Code">💻</a></td> <td align="center"><a href="https://github.com/James300"><img src="https://avatars0.githubusercontent.com/u/9325039?v=4" width="100px;" alt="James300"/> James300</a> <a href="https://github.com/Priceline/design-system/commits?author=James300" title="Code">💻</a></td> </tr> </table>