https://github.com/css-doodle/shapes
Discover new CSS polygon shapes
https://github.com/css-doodle/shapes
Last synced: 16 days ago
JSON representation
Discover new CSS polygon shapes
- Host: GitHub
- URL: https://github.com/css-doodle/shapes
- Owner: css-doodle
- License: mit
- Created: 2021-01-09T08:09:39.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2023-04-01T01:12:52.000Z (about 2 years ago)
- Last Synced: 2025-05-04T08:36:45.516Z (about 2 months ago)
- Language: Svelte
- Homepage: https://css-doodle.com/shapes
- Size: 1.76 MB
- Stars: 137
- Watchers: 3
- Forks: 5
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
# Shapes
A tool for discovering new CSS polygon shapes generated
with [css-doodle](https://css-doodle.com) `@shape()` function and mathematical expressions. Read more about its usage: [https://yuanchuan.dev/polygon-shapes](https://yuanchuan.dev/polygon-shapes).
### Commands
* `fill`: nonzero | evenodd;
* `frame`: number for frame size;
* `points`: number between 3 - 3600;
* `rotate`: number in degree for rotation;
* `scale`: number for scale factor;
* `move`: a pair of value for translating x, y coords;
* `turn`: angle between start/end point, defaults to be 1;
* `x`: x coordinate for cartesian equation;
* `y`: y coordinate for cartesian equation;
* `r`: polar equation;
### Operations
* Operations available: `+`, `-`, `*`, `/`, `%`, `^`, `|`, `&`, `>>`, `<<`.
* All JavaScript Math functions and constants can be used. Such as `sin`, `cos`, `tan`, `PI` or `π` etc.
### Variables
Everything declared is considered a variable.
### Website
[https://css-doodle.com/shapes](https://css-doodle.com/shapes)