Revision fcac9b1f-87a2-4d1c-aa01-b267d1477b9c

TL:DR

 - This is up to you, declaring a parent theme is optional. If you don't declare a parent you will still fallback to the modules (e.g Magento_Catalog) which provide XML and template files but no styling.

 - I don't use any extensions

 - 1. Declare the theme
   2. Remove parent theme CSS (if required)
   3. Add your own CSS

My personal opinion is it's best to create your own 'blank theme' from scratch as you can tailor this to be exactly what you need.

  

This is how I would create a theme from scratch, I have used NewStore/default as my vendor and theme name.

## Create the theme (as per official docs)

Create the theme as per [the official docs](http://devdocs.magento.com/guides/v2.0/frontend-dev-guide/themes/theme-create.html) 

**Optionally declaring a parent**

Within `app/design/frontend/NewStore/default/theme.xml` you have the choice of declaring a parent theme or not, for this example I have left out line 3 (`<parent>Vendor/theme</parent>`) so **there is no parent theme**. This means all templates/layout files will be coming from the modules themselves and not Blank or Luma, and there will no theme styling as this is added in the blank theme.

My theme.xml looks like this:

    <theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/theme.xsd">
        <title>NewStore default</title>
        <media>
            <preview_image>media/preview.jpg</preview_image>
        </media>
    </theme>


## Remove styling (if you set a parent theme) and add your own CSS

If you do set blank or Luma as a parent you will need to prevent the CSS files from loading. To do this create `app/design/frontend/NewStore/default/Magento_Theme/layout/default_head_blocks.xml` and add the following XML:

    <?xml version="1.0" ?>
    <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
        <head>

            <!-- Remove blank/luma theme styling if you declared a parent -->
            <remove src="css/styles-m.css" />
            <remove src="css/styles-l.css" />
            <remove src="css/print.css" />
    
            <!-- Add your own CSS files -->
            <css src="css/styles.css" />
        </head>
    </page>

This removes `styles-m.css`, `styles-l.css` and `print.css` added by the blank theme. It also adds styles.css as a base for your own CSS.

**If you did not specify a parent you can remove the 3 `<remove />` tags in the code above.**


## Add your own CSS

You can now style up your theme however you please, I'm a fan of Sass rather than LESS so I added this file - `app/design/frontend/NewStore/default/web/css/styles.scss`

I changed the background colour in here just to prove this works, ideally you'd only use this file for importing other Sass/Less files.

## Result

The result of what I've just done is a theme with no styling (apart from my beautiful green background) allowing you to style up your theme without working with Magento's (sometimes difficult to work with) styling.

[![enter image description here][1]][1]

## Tips

I find the most frustrating aspect to working with Magento's front-end code is how specific their styling is, to help avoid this I'd recommend using the [BEM naming convention](http://getbem.com/naming/) when writing your own styling.

Also helpful comments are key, if a dev used to working with Luma/Blank worked on a theme built from scratch they'd probably find things work quite differently to what they expect.


  [1]: https://i.sstatic.net/oHXa4.png