Built With Stencil Build

Checkout the complete documentation over here -> https://goatui.com

GOAT UI

GOAT UI contains most used web components built using Stencil. So you don’t need to include any additional framework dependencies, You can simply import required component js, and right away start using it.

Getting Started

Script tag

<!DOCTYPE html>
<html>
<head>
  <meta charset='utf-8'>
  <meta name='viewport' content='width=device-width'>
  <title>Goat UI Component</title>

  <!-- include your custom theme variable values, view variable names at https://unpkg.com/@goatui/components@0.9.11/dist/goatui/assets/styles/theme.css -->
  <!--link rel="stylesheet" href="/custom-theme.css"></link-->
  <script type='module' src='https://unpkg.com/@goatui/components@0.9.11/dist/goatui/goatui.esm.js'></script>

</head>
<body>

<goat-button size='lg' color='primary'>Click me</goat-button>

</body>
</html>

Components

Name Component State
Avatar goat-avatar 🟒
Badge goat-badge 🟑
Breadcrumb goat-breadcrumb 🟒
Button goat-button 🟒
Button Group goat-button-group 🟒
Card goat-card 🟑
Card Select goat-cardselect πŸ”΅
Checkbox goat-checkbox 🟒
Chip goat-chip πŸ”΅
Code Editor goat-card-editor 🟒
Code Highlighter goat-card-highlighter 🟒
Column goat-col πŸ”΅
Color picker goat-colorpicker πŸ”΅
Date picker goat-datepicker πŸ”΅
Date Time picker goat-datetimepicker πŸ”΅
Dialog goat-dialog πŸ”΅
Dropdown goat-dropdown 🟑
Empty State goat-empty-state 🟑
Filepicker goat-filepicker πŸ”΅
Flow Designer goat-flow-designer πŸ”΅
Form Control goat-form-control 🟑
Grid goat-grid πŸ”΅
Group goat-group πŸ”΅
Header goat-header 🟒
Icon goat-icon 🟒
Input goat-input 🟒
Link goat-link 🟒
Modal goat-modal πŸ”΅
Menu goat-menu 🟑
Month picker goat-monthpicker πŸ”΅
Notification goat-notification 🟒
Notification Manager goat-notification-manager 🟑
Observer goat-observer πŸ”΅
Pagination goat-pagination πŸ”΅
Radio Group goat-radiogroup πŸ”΅
Row goat-row πŸ”΅
Select goat-select 🟒
Slider goat-slider πŸ”΅
Spinner goat-spinner 🟒
Spoiler goat-spoiler πŸ”΅
Stepper goat-stepper πŸ”΅
Table goat-table 🟑
Table head goat-tablehead πŸ”΅
Table row goat-tablerow πŸ”΅
Tabs goat-tabs πŸ”΅
Text goat-text 🟑
Textarea goat-textarea 🟒
Time picker goat-timepicker πŸ”΅
Toast goat-toast 🟒
Toggle goat-toggle πŸ”΅
Tooltip goat-tooltip πŸ”΅
Week picker goat-weekpicker πŸ”΅
© 2022 Shivaji Varma. Made in India.