style customizer not working on my custom theme

I am doing my best to learn concrete 5 by developing a site. So I have created my empty basic theme, and have attempted to implement a single variable via the styles customizer - just to see that I understand how it works. The bottom line is that I am getting the customize button on my theme, but upon click, the new panel that opens is empty - no variable, no set titles, no back button, no errors.

Was hoping someone can help me out with this, no local community to ask, don't know anyone personally too, and no answers on stackoverflow - so it is kinda all on you :]

So, my code.

Theme is called 'carmi', lives in the 'carmi' folder under 'themes' in the application directory. has a CSS directory with template.less, styles.xml, and index.html. Also has a typography.less which is not in use.

inside the css directory is a presets directory with two less files: 'defaults' and 'testPreset'. Both have at least one variable.

for page templates I have default, front, full, and view, all of which with the exact same code (except view).

I test the code on a page (not a single), tried several page types.

code in default. php:
defined('C5_EXECUTE') or die ('you shall not pass');
$bodyClass = ($c->isEditMode() ? 'editMode' : '');
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "">
<html xmlns="">
    <?php Loader::element('header_required'); ?>
    <link href="<?php echo $view->getStylesheet('template.less');?>"  rel='stylesheet' type='text/css'>
    //echo $html->css($view->getStylesheet('less/styles.less'));
<body class="<?php echo $bodyClass; ?>" >
    <?php $this->inc('elements/test.php');?>

The test.php element is just some text to prove a point.

code in template.less
@import "presets/defaults.less";
    color: @primary-action-color;
.test-class {
    color: @another-color;

code in defaults.less note that this did not work also without the 3 first variables.
@preset-name: "test";
@preset-icon: concrete-icon(#ffffff, #ff7600, #333333);
@preset-fonts-file: "fonts/defaults.less";
@primary-action-color: #ff7600;
@another-color: #aaaaaa;

code in styles.xml

<?xml version="1.0"?>
<styles version="1.0">
    <set name="test">
        <style name="Primary Action Color" variable="primary-action" type="color" />

code in testPreset.less

@primary-action-color: #aaaaaa;
@another-color: #ff7600;

the less is parsed into the page. I can see it working properly with it's imported variables. But nothing on the customize panel.

Thank you so much if you chose to take the time to read all of this. I was sitting on this for a long time and got quite frustrated :[

View Replies:
jakobfuchs replied on at Permalink Reply
I have the same problem. I did the steps outlined in this video:,... the customize link appears, but when i click it the panel is empty.
jakobfuchs replied on at Permalink Reply
It showed up once I added a named preset via:

@preset-name: "Default";
propush replied on at Permalink Reply
First of all thanks.

This is SO weird, I wish I could understand. I have changed the name to "Default". didn't work. Added fonts folder with defaults.less file in it. worked. Deleted folder. Worked. Changed name from 'Defaults' to something random - works again. Could it be that it was valid once, and now it works even though it is no longer valid?

edit: upon changing back from 'Default' - the display stayed, but changes were not saved. Now it is back to Default, it is working.

Could it be that the defaults.less preset-name MUST be 'Default'?