https://github.com/data-charya/synth-flutter
CRED's Synth neuromorphic components for flutter
https://github.com/data-charya/synth-flutter
dart dartlang flutter flutter-plugin library
Last synced: about 1 year ago
JSON representation
CRED's Synth neuromorphic components for flutter
- Host: GitHub
- URL: https://github.com/data-charya/synth-flutter
- Owner: data-charya
- License: mit
- Created: 2021-08-04T03:53:51.000Z (almost 5 years ago)
- Default Branch: master
- Last Pushed: 2021-08-04T07:54:36.000Z (almost 5 years ago)
- Last Synced: 2025-04-13T12:31:24.762Z (about 1 year ago)
- Topics: dart, dartlang, flutter, flutter-plugin, library
- Language: Dart
- Homepage:
- Size: 280 KB
- Stars: 7
- Watchers: 1
- Forks: 3
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
[](https://flutter.dev/)
[](https://github.com/data-charya/Synth-Flutter/blob/master/LICENSE)
[](https://github.com/data-charya/Synth-Flutter/actions/workflows/dart.yml)
# Synth Neumorphism Components
My take on CRED's Synth Design System. I tried to recreate the components as close to the real thing as possible and will be adding more components down the line.
## Usage
Add the plugin to your pubspec.yaml using :
```dart
flutter pub add synth
```
Import the package and use the components, Its that simple !
```dart
SynthSoftbutton(
text: 'Your Text',
width: 100,
height: 50,
onPressed: ()
{
//write your function definition
},
)
```
## Buttons
### Softbutton
```dart
SynthSoftbutton(
text: 'Your Text',
width: 100,
height: 50,
onPressed: ()
{
//write your function definition
},
)
```
### Drawable Button
```dart
SynthDrawablebutton(
text: 'Your Text',
width: 100,
height: 50,
onPressed: ()
{
//write your function definition
},
)
```
### Flat Button
```dart
SynthFlatbutton(
text: 'Your Text',
width: 100,
height: 50,
onPressed: ()
{
//write your function definition
},
)
```
### Flat Drawable Button
```dart
SynthFlatDrawablebutton(
text: 'Your Text',
width: 100,
height: 50,
onPressed: ()
{
//write your function definition
},
icon: Icon(
Icons.add,
color: primarySynthWhite100,
),
)
)
```
### Img Button
```dart
NeuImgbutton(
radius: 80,
onPressed: ()
{
//write your function definition
},
icon: Icon(
Icons.arrow_back_ios_new_rounded,
),
)
```
### Elevated View
```dart
ElevatedView(
width: 300,
height: 100,
child: Center(
child: Text(
'synth',
style: TextStyle(
fontSize: 25,
fontFamily: 'Gilroy',
fontWeight: FontWeight.w900,
color: primarySynthCopper400,
),
),
),
)
```
### Circular Checkbox
```dart
SynthCircularcheckbox(
width: 30,
height: 30,
onPressed: ()
{
//write your function definition
},
)
```
### RoundedRect Checkbox
```dart
SynthRoundedRectcheckbox(
width: 30,
height: 30,
onPressed: ()
{
//write your function definition here
},
)
```