https://github.com/assisfery/ska-svg
A library to use svg shapes in your web page in the easiest way.
https://github.com/assisfery/ska-svg
javascript-library svg svg-images
Last synced: 11 months ago
JSON representation
A library to use svg shapes in your web page in the easiest way.
- Host: GitHub
- URL: https://github.com/assisfery/ska-svg
- Owner: assisfery
- License: mit
- Created: 2020-02-07T12:13:36.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2020-05-15T19:09:28.000Z (about 6 years ago)
- Last Synced: 2025-03-01T18:18:24.299Z (over 1 year ago)
- Topics: javascript-library, svg, svg-images
- Language: HTML
- Size: 269 KB
- Stars: 10
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
README
## Ska-Svg
A library to use svg shapes in your web page in the easiest way.
[](https://www.jsdelivr.com/package/gh/assisfery/Ska-Svg)
### Demo
See the demo here: https://assisfery.github.io/Ska-Svg/
### Get Started
Just import the **_Ska.css_** and **_Ska.js_** files.
```
```
```
```
### Use Shape
To use a svg shape just put **_data-ska-object="name_of_object"_** attribute in your html container.
```
```
### Colors
You can add colors class in your shapes.
```
```
### Rotate shapes
You can rotate the shapes using the below classes.
```
```
### Fill the width and height
Fill your shapes to its parent.
```
```
### Fixed Shapes
You can fixed your shape in some position of its parent.
```
Fixed Shapes
You can fixed your shape in some position of its parent.
```
### Shadow
You can shadow effects in your shapes using those classes.
```
class="ska-shadow" or class="ska-shadow-lg"
```
### Gradient
Below we have some gradient available in owr library.
```
```
### Custom Gradients
But you can also put your on gradient just adding **_data-ska-gradient-start-color="colorStart"_**, **_data-ska-gradient-end-color="colorStart"_** attributes.
```
```
### Contribute
#### New shapes
1. Draw a new shape
2. Put it in assets directory
3. Add it file name (without extension .svg) in Ska.supportedObjects array in Ska.js
file