我为什么基于拟物化设计理念创建了一个 React 组件库？

所以，如果你是一名设计师或一位充满热情的前端开发人员，那么你很可能听说过拟物化设计（Neumorphism）的概念。

如果你还没让我们了解它：

“这种新拟物化效果融合了当前流行的扁平化用户界面和传统的拟物化设计原则！组件底部带有深色阴影，顶部带有浅色阴影；两者结合，营造出元素仿佛要从屏幕中跃然而出的效果。”

它也被称为软UI。

接下来呢？

当我在 Dribble 上看到这些设计以及在 Medium 上看到相关文章时，我开始思考如何在 ReactJS 中实现它们。

于是，我开始着手开发一个很棒的库，neumorphic-ui我给它起了个名字。我在其中实现了 6 个基本组件，分别是 NeuButton、NeuCard、NeuReaction、NeuHeading、NeuInput 和 NeuProgressBar。
如果你想在 GitHub 上查看，请点击这个链接。

如何使用neumorphic-ui？

我还将其发布为 npm 包。要使用它，只需执行npm install --save neumorphic-ui以下命令即可。

意见/建议

欢迎大家为这个库做贡献。只需拉取代码并提交合并请求即可。我会审核代码，如果符合要求，我会将其合并。如果您有更好的建议，也请给我留言。我的收件箱对所有人开放。您也可以发送邮件至：saeed_dev@yahoo.com。

GitHub 链接：https://github.com/dev-saeed/neumorphic-ui
NPM 链接：https://www.npmjs.com/package/neumorphic-ui
文档链接：https://neumorphic-ui.netlify.com/

感谢阅读。让我们一起构建一个拟物化的世界吧！

鸣谢：

• 新拟物效果的定义来自 S Jagoor 在 Medium 上发表的一篇文章。您可以在这里查看：https://medium.com/@s.jagoori/design-trends-neumorphism-59a9ba9d9284
• 文章中的图片来自https://dribbble.com/shots/9165794-Flight-Search-UI-Exploration/attachments/1208290?mode=media