CSS Injection in Google Docs Forms

Flemming Steffensen found an undocumented trick that lets you customize a Google Docs form by injecting CSS.

Let's assume that the URL of your form is:

https://spreadsheets.google.com/embeddedform?key=0Ato1MNFt5ld1cExhRTl0c1ZMcF8zcWZJRTNPSGhLQkE

You can add some new CSS rules as a value of the f parameter:

https://spreadsheets.google.com/embeddedform?key=0Ato1MNFt5ld1cExhRTl0c1ZMcF8zcWZJRTNPSGhLQkE&f=;}body{font-size:14pt!important}.ss-q-title{color:green}

Here's the result.

The most important things to remember:

1. the value has to start with ;}
2. you need to use !important for some of the rules to override existing values
3. check the source code of the form to find the classes used by Google
4. this a trick that may no longer work in the future.

For more parameters that let you customize Google Docs forms, check this test page.