The theming feature in YeSvelte allows you to customize the appearance of the components to match your project's design system or visual preferences. By following our standard class naming conventions, you can easily create your own themes using CSS.
YeSvelte follows a standard naming convention for CSS class names, making it simple to apply your custom styles. The class names are designed to target specific elements and states within the components.
for example assume Button component, for default .y-button class is
applied, and you can customize style of all buttons, by overriding .y-button
class.
.{prefix}-{component}-{key}-{value}
is applied.
and for boolean properties, .{prefix}-{component}-{key} is applied.
!important.