# Introduction
This is a reference document for Amino, the live CSS editor for Chrome and Edge.
## Amino
Amino is a live CSS editor for Chrome and Edge. It enables users to generate user style sheets that make realtime changes to web page presentation.
The style sheets are executed every time the page is viewed, making them effectively permanent for the user running the extension.
# Features
Amino can be used for customizing page appearance, fixing rendering bugs, and numerous other purposes. The current features include:
* Syntax highlighting
* Automatic indenting and outdenting
* Native editor-like keybindings
* DevTools integration
* SCSS/Sass support
* Autocomplete
* Autosave
* Synced data across desktop devices
* Visual element selector tool
* Copy to clipboard
* Data export
* Dark theme
* Pop-out mode
## Roadmap
* Social sharing
* Increased cloud/local storage limits
* Firefox & Safari versions
# Getting Started
A brief example of how to get started with Amino.
## 1. Add the extension to your Chrome or Edge browser.
Add the extension via:
👉 [Google Chrome Web Store](https://chrome.google.com/webstore/detail/amino-live-css-editor/pbcpfbcibpcbfbmddogfhcijfpboeaaf)\
👉 [Microsoft Edge Add-ons Store](https://microsoftedge.microsoft.com/addons)
*For information on the permissions we request at install, please see* [*Permissions*](broken://pages/-Lb_ZCnOXB6COgY93RVg)*.*
## 2. Visit a website in your browser.
For demonstration purposes, visit [google.com](https://google.com).
## 3. Open the editor from the toolbar icon.
## 4. Alternatively, open the editor from within DevTools.
**Open DevTools:**
1. Mac: `Command+Option+I`
2. Windows/Linux: `F12` or `Control+Shift+I`
**Select the Elements tab:**
**Select the Amino sub-tab:**
## 5. Write some CSS!
# Guides
Guides to help you make the most of Amino.
## Table of Contents
[Editing stylesheets in the web application](/guides/editing-stylesheets-in-the-web-application)
[Installing Amino as a Progressive Web App (PWA)](/guides/installing-amino-as-a-progressive-web-app-pwa)
[Setting browser hotkeys](/guides/setting-browser-hotkeys)
# Editing stylesheets in the web application
There are numerous ways to use the Amino editor. The browser extension contains a pop-up mode, a pop-out mode, and can be opened as a tab within DevTools. We've now added editing capabilities to our web app. Here are a couple of different ways to utilize the editor at [aminoeditor.com](https://aminoeditor.com).
**Hover over an existing stylesheet in your library, and click the edit icon:**
**Alternatively, use the stylesheet menu to open edit mode:**
Either of these will launch the editor within the application:
# Installing Amino as a Progressive Web App (PWA)
Get more out of Amino by installing the PWA.
[Progressive Web Apps](https://web.dev/progressive-web-apps/) (or PWAs) are an exciting development in browser technology that extends web applications by making them installable as a standalone experience on any platform using a single codebase. This document demonstrates how to install Amino as a PWA using Chrome for Mac, but the same process can be used to install Amino as a PWA on other platforms.
Follow these easy steps to install.
**Click the Install button on your browser toolbar, click Install:**
The application will then open in a standalone window:
You will also find the application in the (MacOS) Dock:
You can also locate the Amino PWA through the (MacOS) Spotlight search:
That's it! Those are the basics of how to install and run the Amino PWA.
# Setting browser hotkeys
Setting browser hotkeys to do things with Amino
### In Chrome:
Navigate to: **chrome://extensions/shortcuts**
You can create or modify hotkeys that perform the following two functions:
1. Open the popup editor (affixed to navbar)
2. Open the popout editor (new tab)
# Transferring Stylesheets
Information about transferring stylesheets from the legacy extension to the web app.
4/6/2021
In previous versions of Amino we utilized Google's Chrome Sync API to store user data (stylesheets, extension preferences, etc...) Unfortunately, the Chrome Sync API had a prohibitively small storage limit and was too restrictive for many Amino users. The good news: we now offer our own cloud storage solution at aminoeditor.com, which works seamlessly with the extension.
When you sign up for an account on the website, you will be prompted with a question about what kind of user you are. If you have used Amino previously and think you have stylesheets to transfer, click **"I'm a returning Amino user"** and our system will begin transferring your stylesheets to the website. For the vast majority, that will work perfectly.
### "We were unable to locate any stylesheets to transfer."
If you think you have stylesheets to transfer and you saw this message, confirm that:
* You are using a supported browser (Currently: Chrome, Brave)
* You are using the same browser on the same computer as you previously used Amino
* OR: You are using the same browser somewhere else, are signed into Chrome, and were signed into Chrome when you used Amino in the past
If you meet these criteria you should have no problem completing the transfer successfully. If you continue to have problems and are concerned about data loss, contact for assistance.