Skip to content

Styling ​

Built with daisyui and tailwindcss, providing a powerful and flexible styling solution that allows you to easily customize the look and feel of your components. daisyui provides a set of pre-built components and utilities that work seamlessly with tailwindcss, making it easy to create beautiful and responsive user interfaces.

Styling overview ​

Classes ​

All components accept class attributes, just like normal component. This class will be passed through to the DOM element. You can use it in CSS as expected.

Styling with CSS ​

Styling a part ​

You can style a component part by targeting the class that you provide.

vue
<script setup lang="ts">
import { SBtn, ... } from "masc-vue";
</script>

<template>
	<s-btn>Primary Button</s-btn>
</template>
<script setup lang="ts">
import { SBtn, ... } from "masc-vue";
</script>

<template>
	<s-btn>Primary Button</s-btn>
</template>

Summary ​

MASC Vue is designed to encapsulate styling to DaisyUI and/or Tailwind css, while ensuring you retain complete control over styling.

INFO

Daisy UI: Daisy UI

Tailwind CSS: Tailwind CSS

Released under the MIT License.