Edit in JSFiddle

/*

    While we are waiting for JSFiddle to support LESS integration I figured
    I would get a work around sorted so I can still write it in here
    
    Twitter: @aaronlayton
*/

// Step 1: Select the style element and change it to text/less
$('head style[type="text/css"]').attr('type', 'text/less');

// Step 2: Tell LESS to refresh the styles
less.refreshStyles();

/* 
    You could put this as a oneliner and use it as a shim for JSFiddle

    (function(){ $('head style[type="text/css"]').attr('type', 'text/less');less.refreshStyles(); })()
    
*/

<div class="somediv ">
    Look a box with shadow
</div>

// LESS can go here

/* Implementation */
body { background:#333;padding:30px; }

.somediv {
    background:#fff;
    color:#000;
    padding:15px;
    
    .border-radius(10px);
    .box-shadow(5px, 5px, 6px, 0.3);
    .gradient(top, #fff, #e4e4e4);
}

/* Less Mixins */
.border-radius (@radius: 5px) {
    -webkit-border-radius: @radius;
    -moz-border-radius: @radius;
    border-radius: @radius;
}
.box-shadow (@x: 0px, @y: 3px, @blur: 5px, @alpha: 0.5) {
    -webkit-box-shadow: @x @y @blur rgba(0, 0, 0, @alpha);
    -moz-box-shadow: @x @y @blur rgba(0, 0, 0, @alpha);
    box-shadow: @x @y @blur rgba(0, 0, 0, @alpha);
}
.gradient (@origin: left, @start: #ffffff, @stop: #000000) {
    background-color: @start;
    background-image: -webkit-linear-gradient(@origin, @start, @stop);
    background-image: -moz-linear-gradient(@origin, @start, @stop);
    background-image: -o-linear-gradient(@origin, @start, @stop);
    background-image: -ms-linear-gradient(@origin, @start, @stop);
    background-image: linear-gradient(@origin, @start, @stop);
}