Add Open Props to design-essentials collection

collections/design-essentials/index.md

@@ -21,6 +21,7 @@ items:
  - tabler/tabler-icons
  - saadeghi/daisyui
  - responsively-org/responsively-app
+ - argyleink/open-props
 display_name: Design essentials
 created_by: jonrohan
 ---

topics/open-props/index.md

@@ -0,0 +1,23 @@
+---
+aliases: open-props, openprops, open props
+created_by: Adam Argyle
+display_name: Open Props
+github_url: https://github.com/argyleink/open-props
+logo: open-props.png
+released: November 30, 2021
+short_description: CSS custom properties to help accelerate adaptive and consistent design.
+topic: open-props
+url: https://open-props.style/
+related: tailwind, css-framework, css-layout, css-reset, responsive-design, media-queries
+items: 
+ - https://www.youtube.com/watch?v=9VXR_qRgROE
+ - https://www.youtube.com/watch?v=szPNMKZazzQ
+ - https://www.youtube.com/watch?v=hW-itQMKyiU
+---
+**Open Props** is a comprehensive design system of custom variables created by Adam Argyle that offers expertly crafted web design tokens for animations, borders, colors, shadows, and many more design elements that easily works in any project helping in the creation of beautiful and consistent UI.
+
+It is compatible with tailwind and any frontend framework, is customizable, with predictable name conventions and provides a great and harmonious developer experience. Quite easy to integrate and incrementally adoptable, very much worth to check it out for quick prototyping and full fledge projects.
+
+Also features options to import it from CDN, NPM or CLI, works with CSS-In-JS, CSS modules, PostCSS-JIT-Props, can be loaded from JS, has a very thoughtful normalize script with options to light/dark theming, has VScode and Sublime autocomplete... 
+
+Have I mentioned that is very easy to learn and the docs are so amazing that you wish your site just could look like that? It can with Open Props. 😘