mitchas / Keyframes
Licence: mit
A simple CSS toolbox
Stars: ✭ 149
Labels
Projects that are alternatives of or similar to Keyframes
Construcao De Paginas Web
Desenvolvimento de páginas semânticas, acessíveis e responsivas. 🚀
Stars: ✭ 113 (-24.16%)
Mutual labels: animations
Geckolib
GeckoLib is an animation library for Minecraft Mods, with support for complex 3D keyframe and scriptable math-based animations. Available for Forge and Fabric (1.12, 1.15, 1.16). Supports entity, block, item, armor animations and more.
Stars: ✭ 131 (-12.08%)
Mutual labels: animations
Reanimated 2 Animations Challenges
React Native animations challenges using the new Reanimated2 API.
Stars: ✭ 136 (-8.72%)
Mutual labels: animations
Elixir cli spinners
Spinnig Animations for Command Line Applications
Stars: ✭ 117 (-21.48%)
Mutual labels: animations
Page Transitions Travelapp
Travel App, Native-like Page Transitions
Stars: ✭ 1,637 (+998.66%)
Mutual labels: animations
Tsparticles
tsParticles - Easily create highly customizable particles animations and use them as animated backgrounds for your website. Ready to use components available for React.js, Vue.js (2.x and 3.x), Angular, Svelte, jQuery, Preact, Inferno, Solid, Riot and Web Components.
Stars: ✭ 2,694 (+1708.05%)
Mutual labels: animations
Xamarin.animations
Animate your views with simple shareable animation declarations.
Stars: ✭ 103 (-30.87%)
Mutual labels: animations
Coordinator Behaviors
Android Library. Behaviors for CoordinatorLayout.
Stars: ✭ 143 (-4.03%)
Mutual labels: animations
Material Intro
A simple material design app intro with cool animations and a fluent API.
Stars: ✭ 1,718 (+1053.02%)
Mutual labels: animations
Easytransitions
A simple way to create custom interactive UIViewController transitions
Stars: ✭ 1,592 (+968.46%)
Mutual labels: animations
Animate
Declarative UIView animations without nested closures
Stars: ✭ 124 (-16.78%)
Mutual labels: animations
Page Transitions Travelapp
Travel App, Native-like Page Transitions
Stars: ✭ 134 (-10.07%)
Mutual labels: animations
React Native Svg Animations
SVG Animations wrapper for react-native.
Stars: ✭ 117 (-21.48%)
Mutual labels: animations
Cpcollectionviewkit
Interesting UICollectionView layouts and transitions
Stars: ✭ 140 (-6.04%)
Mutual labels: animations
Happy Birthday
Wish your friend/loved-ones happy birthday in a nerdy way.
Stars: ✭ 113 (-24.16%)
Mutual labels: animations
Flutter Ui Designs
Just collection of UI designs build with flutter. Can run on any mobile, web & desktop.
Stars: ✭ 131 (-12.08%)
Mutual labels: animations
Loading Animations
A Flutter package with a selection of simple yet very customizable set of loading animations.
Stars: ✭ 147 (-1.34%)
Mutual labels: animations
Scrawl Canvas
Responsive, integrated and interactive HTML5 canvas elements. Scrawl-canvas is a JavaScript library designed to make using the HTML5 canvas element a bit easier, and a bit more fun!
Stars: ✭ 134 (-10.07%)
Mutual labels: animations
Keyframes
This is a collection of web apps to live preview and generate various CSS styles. It originally started as a tool just for creating CSS animations (hence the name Keyframes), but now has additional tools.
Tools:
- Animations: A video-editor like timeline to create CSS @Keyframe animations.
- Colors: Full screen RGB color picker. Convert between HEX/RGB. Save palettes to local storge.
- Shadows: A visual CSS box-shadow generator. Single or multi-layer shadows.
- Character Codes: Search for special characters and get their HTML or CSS codes.
Project Installation & Development
Packages
npm install
NPM Commands
Serve on localhost:8080
npm run serve
Build for production
npm run build
Run your tests
npm run test
Lints and fixes files
npm run lint
Other things to set up
App version updates
The current version number of the app is used in a few different places - on the about modal, on the changelog, and also to determine if an update has been pushed, in order to force the cache/PWA to reload.
Before deploying, change the current version number in two places -
- store.js
- service-worker.js
Environment Variables
Fill in your VUE_APP_BASE_URL and VUE_APP_BASE_PATH in .env and .env.production. The base URL should be the bare URL it'll be hosted at (ie https://example.com - no trailing slash) and the base path should be the path at the URL (ie /app if it'll be at example.com/app). For the root, leave it at /.
Production Public Path
If the app is going to be deployed in a sub directory (ie website.com/app/), edit the path in vue.config.js.
Everything else you should know
Third-party libraries
I tried to use as few as possible. Apart from Vue and everything required by it, this project includes:
- VueMoment (MomentJS) for time formatting
- FontAwesome (Pro) for icons. You'll have to switch out icons if you don't have pro.
- Vue Lodash For working with the data.
- Color Convert for working with color values.
Other Features
- Fully responsive/PWA support
- Soft keyboard detection to hide elements on mobile for more space when keyboard is visible.
- Lock scrolling when modal is visible
- LESS Styles with global light/dark themes
- Preferences stored in local storage.
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].