diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
new file mode 100644
index 0000000..3d018d7
--- /dev/null
+++ b/CONTRIBUTING.md
@@ -0,0 +1,194 @@
+# Contributing to Crypt Land UI
+
+Thank you for your interest in contributing to Crypt Land UI! This document provides guidelines and information for contributors.
+
+## Getting Started
+
+### Prerequisites
+
+- Node.js (v14.0.0 or higher)
+- npm (v6.0.0 or higher)
+- Git
+- A GitHub account
+
+### Setting Up the Development Environment
+
+1. Fork the repository on GitHub
+2. Clone your fork locally:
+   ```bash
+   git clone https://github.com/YOUR-USERNAME/crypt-land-UI.git
+   cd crypt-land-UI
+   ```
+3. Add the original repository as an upstream remote:
+   ```bash
+   git remote add upstream https://github.com/abdul-haadi/crypt-land-UI.git
+   ```
+4. Install dependencies:
+   ```bash
+   npm install
+   ```
+5. Start the development server:
+   ```bash
+   npm start
+   ```
+
+## Development Workflow
+
+### Before You Start
+
+1. Check the issue tracker for existing issues
+2. Create a new issue if one doesn't exist
+3. Discuss your proposed changes with maintainers
+
+### Making Changes
+
+1. Create a new branch for your feature or bugfix:
+   ```bash
+   git checkout -b feature/your-feature-name
+   # or
+   git checkout -b fix/your-bug-fix
+   ```
+
+2. Make your changes following the coding standards
+3. Test your changes thoroughly
+4. Commit your changes with a descriptive message:
+   ```bash
+   git commit -m "Add: detailed description of your changes"
+   ```
+
+### Coding Standards
+
+#### JavaScript/React Guidelines
+
+- Use functional components with hooks
+- Follow React best practices
+- Use meaningful variable and function names
+- Add comments for complex logic
+- Ensure components are reusable and modular
+
+#### Code Formatting
+
+- Use consistent indentation (2 spaces)
+- Use semicolons consistently
+- Follow ESLint rules if configured
+- Use Prettier for code formatting if available
+
+#### File Naming Conventions
+
+- Components: PascalCase (e.g., `UserProfile.jsx`)
+- Utilities: camelCase (e.g., `apiHelpers.js`)
+- Constants: UPPER_SNAKE_CASE (e.g., `API_ENDPOINTS.js`)
+
+## Submitting Changes
+
+### Pull Request Process
+
+1. Update your branch with the latest changes from upstream:
+   ```bash
+   git fetch upstream
+   git rebase upstream/main
+   ```
+
+2. Push your changes to your fork:
+   ```bash
+   git push origin feature/your-feature-name
+   ```
+
+3. Create a Pull Request on GitHub with:
+   - Clear title and description
+   - Reference to related issues
+   - Screenshots if applicable
+   - List of changes made
+
+### Pull Request Guidelines
+
+- One feature/fix per pull request
+- Include tests for new functionality
+- Update documentation as needed
+- Ensure all existing tests pass
+- Add meaningful commit messages
+
+## Testing
+
+### Running Tests
+
+```bash
+npm test
+```
+
+### Writing Tests
+
+- Write unit tests for new components
+- Include integration tests for complex features
+- Test edge cases and error conditions
+- Maintain good test coverage
+
+## Documentation
+
+### Updating Documentation
+
+- Update README.md for significant changes
+- Add inline comments for complex code
+- Update API documentation if applicable
+- Include examples for new features
+
+## Reporting Issues
+
+### Bug Reports
+
+When reporting bugs, please include:
+
+- Clear description of the issue
+- Steps to reproduce
+- Expected vs actual behavior
+- Browser and version information
+- Screenshots if applicable
+- Console errors if any
+
+### Feature Requests
+
+For feature requests, please include:
+
+- Clear description of the feature
+- Use case and benefits
+- Possible implementation approach
+- Any relevant examples or mockups
+
+## Code of Conduct
+
+### Our Standards
+
+- Be respectful and inclusive
+- Focus on constructive feedback
+- Help others learn and grow
+- Maintain professionalism in all interactions
+
+### Unacceptable Behavior
+
+- Harassment or discrimination
+- Offensive language or imagery
+- Personal attacks
+- Spam or off-topic discussions
+
+## Getting Help
+
+- Check existing issues and documentation
+- Create an issue for questions or problems
+- Reach out to maintainers for guidance
+- Join community discussions
+
+## Recognition
+
+Contributors will be recognized through:
+
+- Credits in release notes
+- Contributor listings
+- Community acknowledgments
+
+## License
+
+By contributing to this project, you agree that your contributions will be licensed under the same license as the project.
+
+---
+
+Thank you for contributing to Crypt Land UI! Your efforts help make this project better for everyone.
\ No newline at end of file
diff --git a/PROJECT_STRUCTURE.md b/PROJECT_STRUCTURE.md
new file mode 100644
index 0000000..ff5fca0
--- /dev/null
+++ b/PROJECT_STRUCTURE.md
@@ -0,0 +1,288 @@
+# Project Structure Documentation
+
+## Overview
+
+This document provides a detailed breakdown of the crypt-land-UI project structure, explaining the purpose and contents of each directory and file.
+
+## Root Directory Structure
+
+```
+crypt-land-UI/
+├── package.json              # Project configuration and dependencies
+├── package-lock.json         # Dependency lock file
+├── README.md                # Main project documentation
+├── CONTRIBUTING.md          # Contributor guidelines
+├── PROJECT_STRUCTURE.md     # This file - detailed structure docs
+├── public/                  # Static assets directory
+└── src/                     # Source code directory
+```
+
+## File Descriptions
+
+### Root Level Files
+
+#### `package.json`
+- **Purpose**: Project configuration file
+- **Contains**:
+  - Project metadata (name, version, description)
+  - Dependencies and devDependencies
+  - NPM scripts (start, build, test, etc.)
+  - Project configuration settings
+
+#### `package-lock.json`
+- **Purpose**: Dependency version lock file
+- **Contains**:
+  - Exact versions of installed packages
+  - Dependency tree information
+  - Integrity hashes for security
+- **Note**: Auto-generated, should not be manually edited
+
+#### `README.md`
+- **Purpose**: Main project documentation
+- **Contains**:
+  - Project overview and description
+  - Setup and installation instructions
+  - Usage guidelines
+  - Development information
+
+## Directory Structure
+
+### `public/` Directory
+
+```
+public/
+├── index.html           # Main HTML template
+├── favicon.ico          # Website favicon
+├── manifest.json        # Web app manifest
+├── robots.txt           # Search engine crawling rules
+└── (other static assets)
+```
+
+**Purpose**: Static assets that are served directly by the web server
+
+**Typical Contents**:
+- HTML template files
+- Icons and favicons
+- Images that don't require processing
+- Web app manifests
+- SEO-related files (robots.txt, sitemap.xml)
+
+**Key Characteristics**:
+- Files are served as-is without processing
+- Can be referenced directly in HTML
+- Good for assets that don't change frequently
+
+### `src/` Directory
+
+```
+src/
+├── index.js             # Application entry point
+├── App.js               # Main App component
+├── App.css              # Main App styles
+├── components/          # Reusable UI components
+├── pages/               # Page-level components
+├── hooks/               # Custom React hooks
+├── utils/               # Utility functions
+├── services/            # API and external service integrations
+├── contexts/            # React context providers
+├── styles/              # Global styles and themes
+├── assets/              # Images, fonts, and other assets
+└── constants/           # Application constants
+```
+
+**Purpose**: Main source code directory containing all React components and application logic
+
+## Recommended Subdirectory Structure
+
+### `src/components/`
+Reusable UI components organized by functionality:
+```
+components/
+├── common/              # Common UI elements
+│   ├── Button/
+│   ├── Input/
+│   └── Modal/
+├── layout/              # Layout components
+│   ├── Header/
+│   ├── Footer/
+│   └── Sidebar/
+└── features/            # Feature-specific components
+    ├── Authentication/
+    ├── Dashboard/
+    └── Trading/
+```
+
+### `src/pages/`
+Page-level components representing different routes:
+```
+pages/
+├── Home/
+├── Dashboard/
+├── Profile/
+├── Settings/
+└── NotFound/
+```
+
+### `src/hooks/`
+Custom React hooks for shared logic:
+```
+hooks/
+├── useAuth.js
+├── useApi.js
+├── useLocalStorage.js
+└── index.js
+```
+
+### `src/services/`
+API calls and external service integrations:
+```
+services/
+├── api/
+│   ├── auth.js
+│   ├── users.js
+│   └── trading.js
+├── websocket/
+└── storage/
+```
+
+### `src/contexts/`
+React context providers for state management:
+```
+contexts/
+├── AuthContext.js
+├── ThemeContext.js
+├── UserContext.js
+└── index.js
+```
+
+### `src/utils/`
+Utility functions and helpers:
+```
+utils/
+├── formatters.js
+├── validators.js
+├── helpers.js
+└── constants.js
+```
+
+### `src/styles/`
+Global styles and theming:
+```
+styles/
+├── globals.css
+├── variables.css
+├── themes/
+└── mixins/
+```
+
+### `src/assets/`
+Static assets used in components:
+```
+assets/
+├── images/
+├── icons/
+├── fonts/
+└── videos/
+```
+
+## Component Structure Convention
+
+For each component, follow this structure:
+
+```
+ComponentName/
+├── index.js             # Main component file
+├── ComponentName.jsx    # Component implementation
+├── ComponentName.css    # Component styles
+├── ComponentName.test.js # Component tests
+└── README.md           # Component documentation
+```
+
+## File Naming Conventions
+
+### Components
+- **Format**: PascalCase
+- **Examples**: `UserProfile.jsx`, `NavigationBar.jsx`
+
+### Utilities and Services
+- **Format**: camelCase
+- **Examples**: `apiHelpers.js`, `formatUtils.js`
+
+### Constants
+- **Format**: UPPER_SNAKE_CASE
+- **Examples**: `API_ENDPOINTS.js`, `ERROR_MESSAGES.js`
+
+### Styles
+- **Format**: kebab-case or match component name
+- **Examples**: `global-styles.css`, `UserProfile.css`
+
+## Import/Export Patterns
+
+### Index Files
+Use index.js files to simplify imports:
+
+```javascript
+// components/index.js
+export { default as Button } from './Button';
+export { default as Input } from './Input';
+export { default as Modal } from './Modal';
+```
+
+### Default vs Named Exports
+- **Components**: Use default exports
+- **Utilities**: Use named exports
+- **Constants**: Use named exports
+
+## Build Output Structure
+
+After running `npm run build`, the structure becomes:
+
+```
+build/
+├── static/
+│   ├── css/            # Compiled CSS files
+│   ├── js/             # Compiled JavaScript files
+│   └── media/          # Processed media files
+├── index.html          # Processed HTML file
+└── (other static files)
+```
+
+## Environment Configuration
+
+```
+├── .env                 # Default environment variables
+├── .env.local           # Local environment overrides
+├── .env.development     # Development environment
+├── .env.production      # Production environment
+└── .env.test           # Test environment
+```
+
+## Configuration Files
+
+```
+├── .gitignore          # Git ignore rules
+├── .eslintrc.json      # ESLint configuration
+├── .prettierrc         # Prettier configuration
+└── jsconfig.json       # JavaScript/TypeScript configuration
+```
+
+## Best Practices
+
+1. **Keep components small and focused**
+2. **Use consistent naming conventions**
+3. **Organize files by feature when possible**
+4. **Separate concerns (logic, styles, tests)**
+5. **Use index files for cleaner imports**
+6. **Document complex components**
+7. **Follow the established folder structure**
+
+## Notes
+
+- This structure follows React best practices
+- Directories may be added as the project grows
+- Some directories might not exist initially but can be added when needed
+- The structure should remain flexible and adapt to project requirements
+
+---
+
+*This document should be updated as the project structure evolves*
\ No newline at end of file
diff --git a/README.md b/README.md
index 58beeac..9d26363 100644
--- a/README.md
+++ b/README.md
@@ -1,70 +1,162 @@
-# Getting Started with Create React App
+# Crypt Land UI
 
-This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
+A modern React-based user interface for cryptocurrency-related applications.
 
-## Available Scripts
+## Project Overview
 
-In the project directory, you can run:
+Crypt Land UI is a frontend application built with React that provides an intuitive interface for cryptocurrency operations and management. This project serves as the user interface layer for the Crypt Land ecosystem.
+
+## Repository Information
+
+- **Repository**: crypt-land-UI
+- **Owner**: abdul-haadi
+- **Type**: Frontend React Application
+- **Framework**: React.js
+
+## Project Structure
+
+```
+crypt-land-UI/
+├── package.json          # Project dependencies and scripts
+├── package-lock.json     # Locked dependency versions
+├── README.md            # Project documentation (this file)
+├── public/              # Static public assets
+│   └── (static files)   # HTML template, icons, manifest
+└── src/                 # Source code directory
+    └── (components)     # React components and application logic
+```
+
+## Technology Stack
+
+- **Frontend Framework**: React.js
+- **Package Manager**: npm
+- **Build Tool**: Create React App (assumed)
+- **Language**: JavaScript/JSX
+
+## Getting Started
+
+### Prerequisites
+
+Make sure you have the following installed on your system:
+
+- Node.js (v14.0.0 or higher)
+- npm (v6.0.0 or higher)
 
-### `npm start`
+### Installation
 
-Runs the app in the development mode.\
-Open [http://localhost:3000](http://localhost:3000) to view it in your browser.
+1. Clone the repository:
+   ```bash
+   git clone https://github.com/abdul-haadi/crypt-land-UI.git
+   cd crypt-land-UI
+   ```
+
+2. Install dependencies:
+   ```bash
+   npm install
+   ```
+
+### Running the Application
+
+1. Start the development server:
+   ```bash
+   npm start
+   ```
+
+2. Open your browser and navigate to `http://localhost:3000`
+
+### Building for Production
+
+To create a production build:
+
+```bash
+npm run build
+```
+
+This will create an optimized build in the `build` directory.
+
+## Available Scripts
+
+In the project directory, you can run:
 
-The page will reload when you make changes.\
-You may also see any lint errors in the console.
+- `npm start` - Runs the app in development mode
+- `npm test` - Launches the test runner in interactive watch mode
+- `npm run build` - Builds the app for production
+- `npm run eject` - Ejects from Create React App (one-way operation)
 
-### `npm test`
+## Features
 
-Launches the test runner in the interactive watch mode.\
-See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
+- Modern React-based architecture
+- Responsive design for cryptocurrency applications
+- Component-based structure for maintainability
+- Development and production build configurations
 
-### `npm run build`
+## Development Guidelines
 
-Builds the app for production to the `build` folder.\
-It correctly bundles React in production mode and optimizes the build for the best performance.
+### Code Structure
 
-The build is minified and the filenames include the hashes.\
-Your app is ready to be deployed!
+- Place all React components in the `src/` directory
+- Follow React best practices and hooks pattern
+- Use functional components with hooks when possible
+- Maintain consistent naming conventions
 
-See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
+### Styling
 
-### `npm run eject`
+- Follow a consistent styling approach
+- Consider using CSS modules or styled-components
+- Ensure responsive design principles
 
-**Note: this is a one-way operation. Once you `eject`, you can't go back!**
+## Contributing
 
-If you aren't satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
+1. Fork the repository
+2. Create a feature branch (`git checkout -b feature/amazing-feature`)
+3. Commit your changes (`git commit -m 'Add some amazing feature'`)
+4. Push to the branch (`git push origin feature/amazing-feature`)
+5. Open a Pull Request
 
-Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you're on your own.
+## File Structure Details
 
-You don't have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn't feel obligated to use this feature. However we understand that this tool wouldn't be useful if you couldn't customize it when you are ready for it.
+### Root Level Files
 
-## Learn More
+- **package.json**: Contains project metadata, dependencies, and npm scripts
+- **package-lock.json**: Ensures consistent dependency installation across environments
+- **README.md**: Project documentation and setup instructions
 
-You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
+### Directories
 
-To learn React, check out the [React documentation](https://reactjs.org/).
+- **public/**: Contains static assets that will be served directly
+  - Typically includes `index.html`, favicon, and other static resources
+  
+- **src/**: Main source code directory
+  - Contains React components, utilities, and application logic
+  - Entry point is usually `index.js` or `App.js`
 
-### Code Splitting
+## Browser Support
 
-This section has moved here: [https://facebook.github.io/create-react-app/docs/code-splitting](https://facebook.github.io/create-react-app/docs/code-splitting)
+This project supports all modern browsers:
 
-### Analyzing the Bundle Size
+- Chrome (latest)
+- Firefox (latest)
+- Safari (latest)
+- Edge (latest)
 
-This section has moved here: [https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size](https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size)
+## License
 
-### Making a Progressive Web App
+This project is licensed under the MIT License - see the LICENSE file for details.
 
-This section has moved here: [https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app](https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app)
+## Contact
 
-### Advanced Configuration
+**Maintainer**: abdul-haadi  
+**Repository**: https://github.com/abdul-haadi/crypt-land-UI
 
-This section has moved here: [https://facebook.github.io/create-react-app/docs/advanced-configuration](https://facebook.github.io/create-react-app/docs/advanced-configuration)
+## Changelog
 
-### Deployment
+### [Current]
+- Initial project structure
+- Basic React application setup
+- Project documentation created
 
-This section has moved here: [https://facebook.github.io/create-react-app/docs/deployment](https://facebook.github.io/create-react-app/docs/deployment)
+---
 
-### `npm run build` fails to minify
+*Last updated: $(date)*
 
-This section has moved here: [https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify](https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify)
+> This project is part of the Crypt Land ecosystem, providing a comprehensive user interface for cryptocurrency-related operations.
\ No newline at end of file