https://github.com/dingmouren/shadecraft
Neumorphism-style Android Compose component.
https://github.com/dingmouren/shadecraft
android compose kotlin neumorphism neumorphism-ui
Last synced: 6 months ago
JSON representation
Neumorphism-style Android Compose component.
- Host: GitHub
- URL: https://github.com/dingmouren/shadecraft
- Owner: DingMouRen
- Created: 2023-10-16T23:07:16.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-02-28T02:48:23.000Z (over 1 year ago)
- Last Synced: 2025-03-25T18:40:35.964Z (7 months ago)
- Topics: android, compose, kotlin, neumorphism, neumorphism-ui
- Language: Kotlin
- Homepage:
- Size: 6.86 MB
- Stars: 46
- Watchers: 1
- Forks: 4
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
![]()
### [**English Readme**](https://github.com/DingMouRen/ShadeCraft/blob/main/ENGLISHREADME.md)
### 目录
* **什么是Neumorphism?**
* **什么是ShadeCraft?**
* **作品示例**
* **组件展示**
* **组件列表**
* **感谢Neumorphism UI设计师**### 什么是Neumorphism?
Neumorphism是一种虚拟设计趋势,也叫“新拟态”或“新拟物”。它是一种将平面设计和现实世界元素结合起来的设计风格,带有立体感和柔和的灰影,并且使用明暗高光效果来模拟表面的质感。
Neumorphism风格的结构如下:
![]()
主要有三个样式组成,1 个背景+ 2 个投影。在这个基础上,通过改变颜色和大小参数来达到不同效果。
![]()
![]()
### 什么是ShadeCraft?
**ShadeCraft**是一个Neumorphism风格的Compose组件库。便于开发者快速编写Neumorphism风格的APP。
每个设计元素都呈现出柔软而立体的质感,仿佛随时可以触摸到舒适的触感。阴影渐变和柔和的边缘效果勾勒出元素的深度和层次感,仿佛将它们从平面世界中解放出来。同时,这些元素还保持着手工制作的细腻质感,像是由精细的工匠用心打磨而成。### 作品示例
![]()
![]()
![]()
![]()
![]()
![]()
### 组件展示
组件都可以调整亮光、阴影的偏移量、颜色以及模糊程度,以达到想要的效果。
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
### 组件列表
* ShadeButton
* ShadeCalorVerticalProgress
* ShadeCard
* ShadeCircleProgressConcave
* ShadeCircleProgressConvex
* ShadeCircleProgressMixed
* ShadeIconButton
* ShadeImageButton
* ShadeLight
* ShadeLinearProgressIndicator
* ShadeRadioButton
* ShadeScaleOption
* ShadeSearchBar
* ShadeSlider
* ShadeTabElevated
* ShadeTabPathBar
* ShadeTabRow
* ShadeTimepiece
* ShadeToggle
* ShadeToggleConcave
* ShadeValueIndicator
* ShadeWaterRipple
* ShadeWaveProgress### 感谢Neumorphism UI设计师
本项目中的界面示例参考了很多优秀设计师的设计作品,他们都非常优秀和专业,非常感谢他们的设计。
* [**Alena Yurina**](https://dribbble.com/shots/14529540-Music-player-Neumorphism)
* [**Casker**](https://dribbble.com/shots/9833973-Daily-UI-007-Smart-Home-App-Settings)
* [**Dimest**](https://dribbble.com/shots/11018635-Washing-machine)
* [**Kayln Kwan**](https://dribbble.com/shots/17261639-Daily-UI-007-Settings)
* [**Fateme Souri**](https://dribbble.com/shots/16628294-Running-App)
* [**Pierre Pavlovic**](https://dribbble.com/shots/14591976-Neumorphic-Clock-App)