Quicktip: Remove rounded corners

With custom CSS, you can style Kirby's Panel to your liking or your branding. As we introduce more and more CSS variables, this becomes even easier with every Kirby version.

In Kirby 3.7, the Panel got a subtle visual overhaul with slightly rounded corners for a fresh and friendlier look and feel. While we are sure that these changes are very welcome, it's easy to revert to the old look.

Here's how in three steps:

1. In your /site/config/config.php, register your custom Panel stylesheet, e.g

<?php

return [
    // …other setting
    'panel' => [
        'css' => 'assets/css/panel.css'
    ]
];

2. Create the file panel.css in the given path
3. Add the following styles to this file:

:root {
  --rounded-xs: 0;
  --rounded-sm: 0;
  --rounded: 0;
  --rounded-md: 0;
}

And that's it. Visit the Panel, refresh your browser and enjoy the sharp edges.