Was ist Motion DevTools?

Motion DevTools ist eine Chrome-Erweiterung, die von https://motion.dev entwickelt wurde, und ihr Hauptmerkmal ist "Inspect, edit and export animations made with CSS and Motion One.".

Erweiterungsscreenshots

Motion DevTools-Erweiterungs-CRX-Datei herunterladen

Laden Sie Motion DevTools-Erweiterungsdateien im crx-Format herunter, installieren Sie Chrome-Erweiterungen manuell im Browser oder teilen Sie die crx-Dateien mit Freunden, um Chrome-Erweiterungen einfach zu installieren.

Anleitung zur Verwendung der Erweiterung

Motion DevTools is a browser extension to inspect, edit and export animations made with CSS and Motion One.

🔍 Inspect: Press record and interact. Detected CSS and Motion One animations will be plotted on a classic timeline interface. Use the playback controls to scrub through and replay your animation from any point.

✍️ Edit: Add, move and remove keyframes. Edit values and easing with custom controls, and your edits will be reflected on the page in real-time.

🚢 Export: Perfected your animation? Hit the export button to instantly generate code. Export any animation into CSS transitions, CSS animations or Motion One.

Grundlegende Informationen zur Erweiterung

Name	Motion DevTools
ID	mnbliiaiiflhmnndmoidhddombbmgcdk
Offizielle URL	https://chromewebstore.google.com/detail/motion-devtools/mnbliiaiiflhmnndmoidhddombbmgcdk
Beschreibung	Inspect, edit and export animations made with CSS and Motion One.
Dateigröße	788 KB
Installationsanzahl	8,000
Aktuelle Version	2.0.0
Letztes Update	2023-06-08
Veröffentlichungsdatum	2022-03-21
Bewertung	4.20/5 Insgesamt 5 Bewertungen
Entwickler	https://motion.dev
E-Mail	[email protected]
Zahlungsart	in_app
Erweiterungswebsite	https://motion.dev/tools
Unterstützte Sprachen	en
manifest.json
{ "update_url": "https:\/\/clients2.google.com\/service\/update2\/crx", "name": "Motion DevTools", "description": "Inspect, edit and export animations made with CSS and Motion One.", "version": "2.0.0", "key": "MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAjWcsdcmAGQ8cX\/DQG72r1deFTf4ONxlCor1HvW1\/lLG\/R60VCOuEGLR1OKNrCPHid2gFrlShfDe\/1G1VTefoIMt5z7jlHNuC7i7+mQg9ybbPje2HDKUrOAN5ldo3agqnEJFh+wA2rb6ehOIZVpZ7\/F8Lwja196bvWMSNn+9ktM+fYE3DJacZbf\/mySPlvRt8ToG++hE6taMKN4KnMJC08vWZ33fz\/oeQZ2fDMBGOYP\/9S6LOGoPqYY59Z+9wniZjFN4oE4ORxuP9bek0h15FnYeEvutFY8za0wdLng5bqwDWUlgW51x6MZpJWv1JtD66PBlQVHhX9FJV6m\/HUTE\/qwIDAQAB", "manifest_version": 3, "icons": { "16": "\/assets\/icon-16.png", "32": "\/assets\/icon-32.png", "48": "\/assets\/icon-48.png", "128": "\/assets\/icon-128.png" }, "devtools_page": "devtools.html", "background": { "service_worker": "js\/background.js" }, "content_scripts": [ { "matches": [ "" ], "run_at": "document_start", "all_frames": true, "js": [ "js\/bridge.js" ] } ], "web_accessible_resources": [ { "resources": [ "devtools.html", "editor.html", "js\/background.js", "js\/client.js", "js\/devtools.js", "js\/editor.js" ], "matches": [ "https:\/\/\/", "file:\/\/\/", "http:\/\/\/" ], "use_dynamic_url": true } ], "permissions": [ "storage", "webNavigation" ], "host_permissions": [ "file:\/\/\/", "http:\/\/\/", "https:\/\/\/" ], "externally_connectable": { "matches": [ "https:\/\/.motion.dev\/", ":\/\/localhost\/" ] } }