2.0.2 • Public • Published

    Published on webcomponents.org


    Live Demo ↗ | Documentation ↗ | Installation ↗

    <smart-card> is a Custom HTML Element providing Card view with HTML Content](https://htmlelements.com/).

       <smart-card class="basic-card">
            <div class="card-content">
                <span class="card-title">Card Title</span>
                    I am a very simple card. I am good at containing small bits of information.
                    I am convenient because I require little markup to use effectively.
            <div class="card-action">
                <a href="#">This is a link</a>
                <a href="#">This is a link</a>

    Screenshot of smart-card

    Getting Started

    Smart HTML Elements components documentation includes getting started, customization and api documentation topics.

    Getting Started Documentation

    The file structure for Smart HTML Elements

    • source/

      Javascript files.

    • source/styles/

      Component CSS Files.

    • demos/

      Demo files

    Running demos in browser

    1. Fork the Smart-HTML-Elements-Core repository and clone it locally.

    2. Make sure you have npm installed.

    3. When in the Smart-HTML-Elements-Core directory, run npm install and then bower install to install dependencies.

    4. Run a localhost or upload the demo on a web server. Then run:

    • /demos/smart-card/smart-card-overview.htm

    Following the coding style

    We are using ESLint for linting JavaScript code.

    Creating a pull request

    • Make sure your code is compliant with ESLint
    • Submit a pull request with detailed title and description
    • Wait for response from one of our team members


    Apache License 2.0


    npm i @smarthtmlelements/smart-card

    DownloadsWeekly Downloads





    SEE LICENSE IN https://www.htmlelements.com/license/

    Unpacked Size

    25.8 kB

    Total Files


    Last publish


    • smartcustomelements
    • bmarkov