React Native Glow Demos
react-native-animated-glow is a free, open-source library to help you add beautiful, performant glow effects to your buttons, images, and other UI elements in your React Native apps.
defaultRainbow
General
Outer Glow
Inner Glow
cornerRadius:
20
Colors:
+
Colors:
+
outlineWidth:
2
DotSize:
80
DotSize:
40
borderColor:
white
Inset:
20
Inset:
15
animationSpeed:
1.5
NumberOfOrbs:
40
NumberOfOrbs:
60
randomness:
0.001
Opacity:
0.15
Opacity:
1
ScaleAmplitude:
0
ScaleAmplitude:
0
ScaleFrequency:
2.5
ScaleFrequency:
2.5
SpeedMultiplier:
1
SpeedMultiplier:
1
💎
Copy Settings
📋
Paste Settings
oceanSunset
General
Outer Glow
Inner Glow
cornerRadius:
70
Colors:
+
Colors:
+
outlineWidth:
0
DotSize:
50
DotSize:
30
borderColor:
white
Inset:
9
Inset:
9
animationSpeed:
1
NumberOfOrbs:
40
NumberOfOrbs:
60
randomness:
0.001
Opacity:
0.5
Opacity:
1
ScaleAmplitude:
0
ScaleAmplitude:
0
ScaleFrequency:
2.5
ScaleFrequency:
2.5
SpeedMultiplier:
1
SpeedMultiplier:
1
💎
Copy Settings
📋
Paste Settings
neonGreen
General
Outer Glow
Inner Glow
cornerRadius:
50
Colors:
+
Colors:
+
outlineWidth:
1
DotSize:
80
DotSize:
60
borderColor:
#9dff00
Inset:
33
Inset:
25
animationSpeed:
3
NumberOfOrbs:
30
NumberOfOrbs:
35
randomness:
0.01
Opacity:
0.45
Opacity:
1
ScaleAmplitude:
0.1
ScaleAmplitude:
0.1
ScaleFrequency:
1
ScaleFrequency:
1
SpeedMultiplier:
1
SpeedMultiplier:
1
💎
Copy Settings
📋
Paste Settings
hotFlame
General
Outer Glow
Inner Glow
cornerRadius:
50
Colors:
+
Colors:
+
outlineWidth:
3
DotSize:
50
DotSize:
30
borderColor:
#ffc790
Inset:
35
Inset:
20
animationSpeed:
0.1
NumberOfOrbs:
60
NumberOfOrbs:
40
randomness:
0.5
Opacity:
0.6
Opacity:
1
ScaleAmplitude:
1
ScaleAmplitude:
1
ScaleFrequency:
11
ScaleFrequency:
8
SpeedMultiplier:
1
SpeedMultiplier:
1
💎
Copy Settings
📋
Paste Settings
ripple
General
Outer Glow
Inner Glow
cornerRadius:
70
Colors:
+
Colors:
+
outlineWidth:
1
DotSize:
50
DotSize:
20
borderColor:
#da63dd
Inset:
15
Inset:
7
animationSpeed:
1
NumberOfOrbs:
40
NumberOfOrbs:
60
randomness:
0.001
Opacity:
0.4
Opacity:
1
ScaleAmplitude:
0
ScaleAmplitude:
0
ScaleFrequency:
2.5
ScaleFrequency:
2.5
SpeedMultiplier:
1
SpeedMultiplier:
1
💎
Copy Settings
📋
Paste Settings
pureWhite
General
Outer Glow
Inner Glow
cornerRadius:
60
Colors:
+
Colors:
+
outlineWidth:
4
DotSize:
70
DotSize:
30
borderColor:
white
Inset:
20
Inset:
11
animationSpeed:
0
NumberOfOrbs:
40
NumberOfOrbs:
60
randomness:
0
Opacity:
0.1
Opacity:
1
ScaleAmplitude:
0
ScaleAmplitude:
0
ScaleFrequency:
0
ScaleFrequency:
0
SpeedMultiplier:
0
SpeedMultiplier:
0
💎
Copy Settings
📋
Paste Settings
alert
General
Outer Glow
Inner Glow
cornerRadius:
20
Colors:
+
Colors:
+
outlineWidth:
2
DotSize:
90
DotSize:
60
borderColor:
#ffc5c5
Inset:
30
Inset:
25
animationSpeed:
4.5
NumberOfOrbs:
15
NumberOfOrbs:
35
randomness:
0.01
Opacity:
0.7
Opacity:
1
ScaleAmplitude:
0
ScaleAmplitude:
0
ScaleFrequency:
2.5
ScaleFrequency:
2.5
SpeedMultiplier:
1
SpeedMultiplier:
1
💎
Copy Settings
📋
Paste Settings
vaporwave
General
Outer Glow
Inner Glow
cornerRadius:
50
Colors:
+
Colors:
+
outlineWidth:
2
DotSize:
50
DotSize:
50
borderColor:
white
Inset:
30
Inset:
15
animationSpeed:
1
NumberOfOrbs:
30
NumberOfOrbs:
40
randomness:
0.01
Opacity:
0.5
Opacity:
0.9
ScaleAmplitude:
1
ScaleAmplitude:
0.2
ScaleFrequency:
1
ScaleFrequency:
2
SpeedMultiplier:
1
SpeedMultiplier:
0.8
💎
Copy Settings
📋
Paste Settings
showtime
General
Outer Glow
Inner Glow
cornerRadius:
0
Colors:
+
Colors:
+
outlineWidth:
2
DotSize:
50
DotSize:
5
borderColor:
white
Inset:
15
Inset:
0
animationSpeed:
0.01
NumberOfOrbs:
20
NumberOfOrbs:
25
randomness:
0
Opacity:
0.4
Opacity:
1
ScaleAmplitude:
0.1
ScaleAmplitude:
0.2
ScaleFrequency:
10
ScaleFrequency:
10
SpeedMultiplier:
10
SpeedMultiplier:
10
💎
Copy Settings
📋
Paste Settings
plasmaArc
General
Outer Glow
Inner Glow
cornerRadius:
40
Colors:
+
Colors:
+
outlineWidth:
2
DotSize:
19
DotSize:
20
borderColor:
#4ef4fb
Inset:
11
Inset:
10
animationSpeed:
1
NumberOfOrbs:
50
NumberOfOrbs:
50
randomness:
0
Opacity:
1
Opacity:
1
ScaleAmplitude:
1
ScaleAmplitude:
1
ScaleFrequency:
1
ScaleFrequency:
0.5
SpeedMultiplier:
1
SpeedMultiplier:
1
💎
Copy Settings
📋
Paste Settings
confirmationGreen
General
Outer Glow
Inner Glow
cornerRadius:
10
Colors:
+
Colors:
+
outlineWidth:
0
DotSize:
15
DotSize:
10
borderColor:
white
Inset:
1
Inset:
2
animationSpeed:
1
NumberOfOrbs:
100
NumberOfOrbs:
200
randomness:
0
Opacity:
0.4
Opacity:
1
ScaleAmplitude:
0
ScaleAmplitude:
1
ScaleFrequency:
0
ScaleFrequency:
0
SpeedMultiplier:
1
SpeedMultiplier:
1
💎
Copy Settings
📋
Paste Settings
softWarning
General
Outer Glow
Inner Glow
cornerRadius:
20
Colors:
+
Colors:
+
outlineWidth:
2
DotSize:
60
DotSize:
80
borderColor:
white
Inset:
10
Inset:
30
animationSpeed:
0.1
NumberOfOrbs:
30
NumberOfOrbs:
40
randomness:
0.001
Opacity:
0.7
Opacity:
0.8
ScaleAmplitude:
0
ScaleAmplitude:
0
ScaleFrequency:
1
ScaleFrequency:
1
SpeedMultiplier:
1
SpeedMultiplier:
1
💎
Copy Settings
📋
Paste Settings
cosmicNebula
General
Outer Glow
Inner Glow
cornerRadius:
10
Colors:
+
Colors:
+
outlineWidth:
2
DotSize:
100
DotSize:
30
borderColor:
white
Inset:
25
Inset:
8
animationSpeed:
0.6
NumberOfOrbs:
25
NumberOfOrbs:
65
randomness:
0.001
Opacity:
0.9
Opacity:
1
ScaleAmplitude:
0
ScaleAmplitude:
0
ScaleFrequency:
2.5
ScaleFrequency:
2.5
SpeedMultiplier:
1
SpeedMultiplier:
1
💎
Copy Settings
📋
Paste Settings
cloud
General
Outer Glow
Inner Glow
cornerRadius:
60
Colors:
+
Colors:
+
outlineWidth:
4
DotSize:
80
DotSize:
20
borderColor:
white
Inset:
25
Inset:
4
animationSpeed:
0.1
NumberOfOrbs:
10
NumberOfOrbs:
100
randomness:
0.03
Opacity:
0.5
Opacity:
0.3
ScaleAmplitude:
0.1
ScaleAmplitude:
0.2
ScaleFrequency:
1
ScaleFrequency:
10
SpeedMultiplier:
1
SpeedMultiplier:
1
💎
Copy Settings
📋
Paste Settings
cyberPink
General
Outer Glow
Inner Glow
cornerRadius:
50
Colors:
+
Colors:
+
outlineWidth:
2
DotSize:
110
DotSize:
60
borderColor:
white
Inset:
33
Inset:
25
animationSpeed:
3
NumberOfOrbs:
15
NumberOfOrbs:
35
randomness:
0.01
Opacity:
0.45
Opacity:
1
ScaleAmplitude:
0.1
ScaleAmplitude:
0.1
ScaleFrequency:
1
ScaleFrequency:
1
SpeedMultiplier:
1
SpeedMultiplier:
1
💎
Copy Settings
📋
Paste Settings
synthwaveRider
General
Outer Glow
Inner Glow
cornerRadius:
50
Colors:
+
Colors:
+
outlineWidth:
2
DotSize:
10
DotSize:
28
borderColor:
white
Inset:
4
Inset:
19
animationSpeed:
1
NumberOfOrbs:
100
NumberOfOrbs:
100
randomness:
0
Opacity:
1
Opacity:
0.5
ScaleAmplitude:
1
ScaleAmplitude:
1
ScaleFrequency:
1
ScaleFrequency:
1
SpeedMultiplier:
1
SpeedMultiplier:
0.8
💎
Copy Settings
📋
Paste Settings
goldenAura
General
Outer Glow
Inner Glow
cornerRadius:
60
Colors:
+
Colors:
+
outlineWidth:
4
DotSize:
80
DotSize:
40
borderColor:
#ffe65e
Inset:
10
Inset:
15
animationSpeed:
0
NumberOfOrbs:
15
NumberOfOrbs:
40
randomness:
0
Opacity:
0.2
Opacity:
1
ScaleAmplitude:
0
ScaleAmplitude:
0
ScaleFrequency:
1
ScaleFrequency:
1
SpeedMultiplier:
1
SpeedMultiplier:
1
💎
Copy Settings
📋
Paste Settings
enchantedForest
General
Outer Glow
Inner Glow
cornerRadius:
10
Colors:
+
Colors:
+
outlineWidth:
2
DotSize:
70
DotSize:
15
borderColor:
#98ffa1
Inset:
20
Inset:
1
animationSpeed:
0.01
NumberOfOrbs:
40
NumberOfOrbs:
120
randomness:
0.001
Opacity:
0.3
Opacity:
0.3
ScaleAmplitude:
0.2
ScaleAmplitude:
0.3
ScaleFrequency:
12
ScaleFrequency:
9
SpeedMultiplier:
10
SpeedMultiplier:
11
💎
Copy Settings
📋
Paste Settings
pastelDream
General
Outer Glow
Inner Glow
cornerRadius:
10
Colors:
+
Colors:
+
outlineWidth:
3
DotSize:
50
DotSize:
12
borderColor:
#ffffff
Inset:
10
Inset:
2
animationSpeed:
1
NumberOfOrbs:
60
NumberOfOrbs:
120
randomness:
0
Opacity:
0.2
Opacity:
1
ScaleAmplitude:
0
ScaleAmplitude:
0
ScaleFrequency:
2.5
ScaleFrequency:
2.5
SpeedMultiplier:
1
SpeedMultiplier:
1
💎
Copy Settings
📋
Paste Settings
siren
General
Outer Glow
Inner Glow
cornerRadius:
10
Colors:
+
Colors:
+
outlineWidth:
0
DotSize:
12
DotSize:
8
borderColor:
#acc0ff
Inset:
2
Inset:
2
animationSpeed:
1
NumberOfOrbs:
100
NumberOfOrbs:
100
randomness:
0
Opacity:
1
Opacity:
1
ScaleAmplitude:
0.2
ScaleAmplitude:
0.2
ScaleFrequency:
3
ScaleFrequency:
3
SpeedMultiplier:
1
SpeedMultiplier:
2
💎
Copy Settings
📋
Paste Settings
arcticFreeze
General
Outer Glow
Inner Glow
cornerRadius:
60
Colors:
+
Colors:
+
outlineWidth:
4
DotSize:
80
DotSize:
50
borderColor:
white
Inset:
30
Inset:
20
animationSpeed:
1
NumberOfOrbs:
100
NumberOfOrbs:
100
randomness:
0.01
Opacity:
0.4
Opacity:
1
ScaleAmplitude:
0.1
ScaleAmplitude:
0.1
ScaleFrequency:
1
ScaleFrequency:
1
SpeedMultiplier:
1
SpeedMultiplier:
1
💎
Copy Settings
📋
Paste Settings
spotLight
General
Outer Glow
Inner Glow
cornerRadius:
60
Colors:
+
Colors:
+
outlineWidth:
2
DotSize:
80
DotSize:
40
borderColor:
white
Inset:
30
Inset:
10
animationSpeed:
1
NumberOfOrbs:
20
NumberOfOrbs:
50
randomness:
0
Opacity:
0.1
Opacity:
1
ScaleAmplitude:
1.01
ScaleAmplitude:
1.001
ScaleFrequency:
2
ScaleFrequency:
2
SpeedMultiplier:
1
SpeedMultiplier:
1
💎
Copy Settings
📋
Paste Settings
moltenCore
General
Outer Glow
Inner Glow
cornerRadius:
70
Colors:
+
Colors:
+
outlineWidth:
2
DotSize:
70
DotSize:
40
borderColor:
#4d1d00
Inset:
30
Inset:
20
animationSpeed:
0.2
NumberOfOrbs:
40
NumberOfOrbs:
60
randomness:
0.1
Opacity:
0.6
Opacity:
1
ScaleAmplitude:
0.3
ScaleAmplitude:
0.4
ScaleFrequency:
1.5
ScaleFrequency:
1
SpeedMultiplier:
1
SpeedMultiplier:
0.8
💎
Copy Settings
📋
Paste Settings
auroraBorealis
General
Outer Glow
Inner Glow
cornerRadius:
30
Colors:
+
Colors:
+
outlineWidth:
0
DotSize:
120
DotSize:
80
borderColor:
white
Inset:
20
Inset:
15
animationSpeed:
0.3
NumberOfOrbs:
25
NumberOfOrbs:
30
randomness:
0.005
Opacity:
0.6
Opacity:
0.7
ScaleAmplitude:
0.1
ScaleAmplitude:
0.1
ScaleFrequency:
0.2
ScaleFrequency:
0.3
SpeedMultiplier:
1
SpeedMultiplier:
0.8
💎
Copy Settings
📋
Paste Settings